[Haydie]

Hello!
When the top menu flips over to fixed position then content jumps up 91 pixels (height of non fixed header).

Here are two possible solutions:

1. Scroll top menu up, move main content and footer down 91px when menu becomes fixed

.fixed-header + #main-wrapper,
.fixed-header + #colophon {
    position: relative;
    top: 91px;
}

2. Always a fixed top menu

#masthead {
    position: fixed;
}

#main-wrapper,
#colophon {
    position: relative;
    top: 91px;
}

Put code in Appearance / Theme options / Custom CSS

Nice if theme could implement alt 1!

Best regards Johan

[Sakin]

@Haydie: But this is effect that Adventurous theme is using. Every theme has different design. Yes, you can add css to make changes. That is why we have custom css box.

Thanks for the feedback. We will check on it.

[Haydie]

The fixed menu effect is great!

But I don’t think your intention was to make content suddenly jump nearly a 100 pixels!

You can test my fix here: http://fjallbua.se.preview.binero.se/

Note: site is under development!!

And a (corrected) fix could be:

.fixed-header + #main-wrapper, 
.fixed-header + #main-wrapper + #colophon {
    position: relative;
    top: 91px;
}

🙂

best regards Johan

[Sakin]

@Haydie: I check in your site and don’t see any changes. I also don’t see where you have added in that CSS. I understand what are you talking about but It’s not working for me.

[Haydie]

It’s added in the child theme CSS at lines 41-45 or so.

http://fjallbua.se.preview.binero.se/wp-content/themes/adventurous-fjallbua/style.css

Don’t look at the menu while scrolling. Look at the content. At the exact moment when the menu becomes fixed the content jumps up some 90 pixels!

Check in on http://catchthemes.com/demo/adventurous/
Second tiger, mouse pointer in tigers eye, scroll down.
When pointer reaches tigers first whisker menu pops over to fixed and tigers whiskers jump up quite a bit!

best regards Johan

[Sakin]

@Haydie: Ok we will add it in next version update. Thanks

[Sakin]

@Haydie: After adding this CSS, we have footer footer over content issue. See this screenshot https://www.dropbox.com/s/jkx3jqvieb6d345/Screenshot%202015-09-25%2021.31.11.png?dl=0

[Author]

Posts