Streaming live at 10am (PST)

Help with cloned element: expanding segments & unlinking duplicated items

Hello, I am rather new to Webflow so bare with me.
I understand that the link below is just the link from WebDev stripped down to just the element, but an explanation using this will be equally as effective as I am just using the middle element.
The middle element in my project has been modified to have 6 sections, I have been trying to figure out how to make each section expand wider than in the demo, (either to the full width of the screen or a bit less) but for the life of me I cant figure it out.

My second question is how to do I unlink each of the 6 segments from each other without loosing there layout and previous interaction of expanding on hover? I have tried to create a custom class but it either still affects other elements or just deletes the information already there.

Any help would be great thankyou!

Here is my public share link: LINK
(how to access public share link)

To your first question

Your “d-8-image-wrapper” container is set to display flex. And all of the 7 “d-8-image” classes are set to “Shrink” at Normal-State and “Nothing” at Hover State. So the will shrink equally but if you hover over on of them the will grow to there set size.

So to make it grow bigger select a image and select the “hover” state:

png%20-%20Greenshot%20Editor

Then change to the class “d-8-image” so you will get all sections:
png%20-%20Greenshot%20Editor

And set the grow to 15 for example. (TOP RIGHT at the screenshot)

Hope this will help :wink:

To your second question: What do you mean by that? So what do you wanna do? Because with extra classes they are “unlinked” at some points :wink:

Hello! Thanks so much for your help! I may have figured out my other query but I do have another question, if was to insert a slider gallery element as 50% width of the page and the other 50% the element we were previously working on, how do make the segments grow larger outside of the container covering part of the slider when it is hover over?

You mean that? --> DEMO

Sorry if i am wrong but i am not a 100% sure what you mean… :smiley:

Hello! That is almost exactly what i meant, although when I try to recreate it on my own the slider section wont shrink when hovering over other segments?
Thanks :3

You can clone my site here if you want :wink:

Hi, thanks for sending over a cloned version but unfortunately after I clone it, every time i open it the canvas is completely blank with no content in the navigator :l
not sure if its something im messing up on my end or not but any help would great thanks!

Sorry to hear that… but I think I cant do anything…
If you need it asap I can make a recording how I did it so you can rebuild it :wink:

Hi, i’ve cloned the element i’m working with, any chance you could take a look and see where I am going wrong?

https://preview.webflow.com/preview/connors-sublime-project-04a0d3?utm_medium=preview_link&utm_source=designer&utm_content=connors-sublime-project-04a0d3&preview=c646aaa1c4a5e54e17ecde93ed9c12fe&mode=preview

thanks so much,

Connor

i will check it after work :wink:

Okay thanks alot I look forward to hearing form you :slight_smile:

ok… i tried to fix your project but couldnt fix it 100%…
So i updated my site wich you can clone…

There are now 1 Slider and 6 Bars instead of 5…

Maybe this will help you: HERE