move menu

Viewing 9 replies - 1 through 9 (of 9 total)
  • Theme Author James Koster


    Hey, you should be able to do this with CSS yeah.

    Something like;

    @media only screen and (min-width: 769px) {
    .main-nav {

    Just adjust the top value to suit.


    I am trying to do the same as the original poster (move the menu to below the header).

    I have inserted the above code into my child style.css (correcting for the misspelling of position), however when I adjust the ‘top’ value the menu bar moves down about 1cm on the screen but no further (regardless of what px value I insert).

    Any help would be greatly appreciated 🙂

    The website url is: http://www.aspectpacific.com.au/WPTEST/



    ed88 I did these adjustments and it looked fine remember to try these to your child theme:

    .main-nav {
    top: 312px;

    .csstransforms3d.csstransitions .show-nav .main-nav {
    transform: translate3d(-100%, -312px, 0px);

    the first one is for non responsive part and the second one is for responsive add these to your child theme and see how it works out for you! 🙂

    Thanks for the reply designbyjesseR. However I get no luck when adding the above code to my child theme. The menu bar doesn’t move at all. The only other thing I can think of that might be affecting it is my header. To widen my header I have added the following to my child theme.

    .header {
    height: 150px;

    Would this be affecting it?

    Thanks this worked great for me!

    note: I had to add a selector, .admin-bar, because that’s the way it is called in the parent theme… or use !important.

    @media only screen and (min-width: 769px) {
    .admin-bar .main-nav {
    }/*Move the main nav menu below the header. Non-responsive only */

    Is anybody still having an issue with this? I used the code AJD supplied, with an adjustment to top:500px;
    The location of the menu is perfect upon initial fixed sight. However, it hovers as I scroll down the page, in the middle of the page, blocking all text/pictures/etc.
    How do I keep the menu fixed – starting below the header (which I have completed) – and then fixed at the top of the page as the reader scrolls to the bottom? Any help is appreciated



    Forum Moderator

    @jonbquist: If you require assistance then, as per the Forum Welcome, please post your own topic.

    This topic references an old version of WordPress.

    I typo-ed ‘position’ in my code snippet. That would probably be the issue, it needs to be: position:absolute

    Your menu is still: position:fixed, but 500px down from the top of the screen.

    Perfect – thanks AJD

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘move menu’ is closed to new replies.
Skip to toolbar