WordPress.org

Support

Support » How-To and Troubleshooting » [Resolved] Navigation keeps "jumping" to next line?

[Resolved] Navigation keeps "jumping" to next line?

  • For some reason, my navigation-bar keeps jumping to next line, when i resize my browser window. Even though there is plenty of space before “hitting” the logo.

    My site is here: http://selectedbloggers.cphadsdemo.dk

    I’ve tried with display: inline-block, position: relative and a lot of other things found by searching the interwebs and this forum, but nothing seems to get the job done 🙁

Viewing 6 replies - 1 through 6 (of 6 total)
  • You have 64px top padding on this element:

    #menu-container

    When you reduce the size of the browser it pushes that down and the padding then, is too much.

    A media query could sort that.

    I appreciate your answer, martcol, but my problem is when i resize the width of the browser – so i dont think it has something to do with the top padding. The reason for the top padding is so that the navigation will stay at the bottom of the header.

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    Looks like your issue is with using floats; floated elements will naturally drop below one another when there isn’t enough room for them to sit aside.

    Which theme are you using?

    Im using a custom theme called photolux. Would it be better to drop the floating left and right and maybe just display: inline-block; on the two elements?

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    You can get away with not floating the menu container at all, just keeping the logo container floated left. You may also need to get rid of the width set in the menu container.

    Thank you Andrews! I simply removed float and width from the menu-container and kept float:right on the logo-container, so now i works like a charm 😀

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘[Resolved] Navigation keeps "jumping" to next line?’ is closed to new replies.
Skip to toolbar