small medium large xlarge

Back to: All Forums  HTML5 and CSS3
18 Feb 2016, 17:09
Jason Carnahan (1 post)

Hello All,

I am having trouble with some overlapping DIV elements on a new layout i’m working on. I believe the problem may have to do with positioning but i’m not quite sure and can’t seem to fix it.

I have an image slider (jquery) that is set to take up the full height of the browser page, and that’s working great. The problem is the content DIV i have below that (which is visible when scrolling) is overlapping a bit.

To see what i mean check it out here

When the page loads, use the nav arrows to change slides so it’s easier to see what i’m talking about. If you’re still not seeing it, resize the window (reduce width) and you’ll see the background color is overlapping with the content below.

What am i missing here? Is there a better way to have a full-page slider or is there a simple fix so that my content won’t overlap?

Thanks in advance for any help!