yooui
yooui

Reputation: 15

Section overlays on another

Dear Stackoverflow community,

I'm very desperated about following setup:
- I have a Website with a Jquery onepagescroll design.
- If the width of the browsers window is below a certain point (769px) the onepagescroll disapears
- Instead a Gumby based design gets activated

But when happening so
... the third of the three sections overlays over the second one a
... after the first section is a gap

I researchead about four hours on this problem and couldn't solve it.
I hope you can help me.

Yours Sinceryl,
yooui


Code:
index.html (http://pastebin.com/6fMtkBbm)

jquery.onepage-scroll.js (http://pastebin.com/FnQWWe7J)

Upvotes: 1

Views: 82

Answers (1)

pschueller
pschueller

Reputation: 4427

To fix the spacing and overlap, take a look at your CSS. The three "section" elements each have a height of 100%, you'll have to change that in your responsive styles.

So try adding something like this:

@media only screen and (max-width: 768px) {
    .onepage-wrapper .section {
        height: auto;
    }
}

Upvotes: 1

Related Questions