Streaming live at 10am (PST)

Relative position for overlapping sections question


#1

I've set a Section with a z-index and adjusted its position upwards as I need it to overlap an item above. All has worked well until I've come to add another Section below - there's now a gap where the original section was before I shifted it up, that I can't get rid of. Probably easier to show in the designer if you take a look at my link.

There's a light layout of my site in the background that I'm using as a guide, you'll notice that the main heading "There is no aftermarket supplier in the UK with more experience or history" is too low and I can't see a way to move the section up.

Sorry, I'm a beginner (if you hadn't noticed) so its probably something obvious. Or, I've used Sections incorrectly in order to try and achieve my design.

Any help would be greatly appreciated.


Here is my public share link: https://preview.webflow.com/preview/neils-supercool-project?preview=d40e4c7a02ad2886dc763422e304bbc6


#2

Hi @connectcreative!

Are you talking about the black box on your site? If so, try taking it out of the section and the container. Set the position of the div itself to absolute, give it a really high z-index (I always use 2000 when testing things like this), and adjust the position margins.

Apologies if I'm misunderstanding your question!


#3

Many thanks Laura! This is a huge help. I THINK I've done it, you can take a look on the link now.

Only thing I'm note sure about is the warning triangle with the message "Add Position Relative to the parent element that you wish to position around"


#4

Glad it helped!

To tell you the truth, I'm not totally sure why it wants you to make that box relative (vs. absolute)-- it could have something to do with the relative positions you've assigned to the other page elements or the interior black box elements. But regardless, I took a look and it seems like it's allowing the absolute position for the part you want (I also checked the tabled/mobile settings) so you should be good to go with ignoring that pesky triangle.

Also, I would take the black box also out of the container and just adjust the position of the black box div.


#5

Many thanks Laura, really appreciate your help on that and the follow-up explanation - thank you!


#6

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.