move menu

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

Something like;

@media only screen and (min-width: 769px) {
.main-nav {
postition:absolute;
top:300px;
}
}

Just adjust the top value to suit.

Thanks

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: https://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 {
postition:absolute;
top:300px;
}/*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

@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