main menu below header image

janagran · Member · Feb 23, 2017 at 10:10 am
Copy link

Add topic to favorites
Hi, I would like my main menu to appear below the header image, at the moment it is above it. Is this possible and how do I do it? Thanks very much.

The blog I need help with is: (visible only to logged in users)
janagran · Member · Feb 24, 2017 at 10:28 am
Copy link
Hi, would really appreciate if someone could reply and let me know whether or not it is possible to move my main menu below the header image. And if it is, then how? Thanks very much
thesacredpath · Member · Feb 25, 2017 at 2:13 am
Copy link
Hi @janagran, since I work from oldest to newest in the forum, if you reply to your own thread to bump it, it effectively moves it to the bottom of my list, which means you will typically end up waiting longer for a reply.

We can reorder the header and menu using the following CSS, but one caveat I’ll mention is that although the majority of browsers have been supporting this for quite some time, in the case of Internet Explorer, it was not fully supported until IE11. IE10 partially supported it, but it is quite flakey on 10.
```
#masthead {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
}
.header-image {
	-webkit-order: 1;
	order: 1;
}
.site-header-main {
	-webkit-order: 2;
	order: 2;
}
```
janagran · Member · Feb 25, 2017 at 10:15 am
Copy link
Thank you so much for your help. Apologies for my impatience.
thesacredpath · Member · Feb 26, 2017 at 6:46 pm
Copy link
No worries, and you are welcome.

No items found.