Header Widget Positioning

Hi Andy,

Hmm, you could try something like this:

.inside-header {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
}
    
.header-widget {
	-webkit-box-ordinal-group: 5;  
	-moz-box-ordinal-group: 5;     
	-ms-flex-order: 5;     
	-webkit-order: 5;  
	order: 5;
}
	
.main-navigation {
	-webkit-box-ordinal-group: 4;  
	-moz-box-ordinal-group: 4;     
	-ms-flex-order: 4;     
	-webkit-order: 4;  
	order: 4;
}

Thanks, almost there, but Nav is central instead of below widget:

URL: http://tinyurl.com/zrtj257

Hmm ok, scrap that idea.

Edit the generate_header_items() function and remove the header widget function: https://gist.github.com/generatepress/4cfa628cec96088dcbf8dd8cf399b83e

Then add the function into GP Hooks in the "After Header Content" area:

<?php generate_construct_header_widget(); ?>

Thanks it worked after I added a clear to the widget but in the end decided it looked too busy/cramped with Nav, Cart and Search bar all in the same place, so went back to nav below header.

Sorry to have wasted your valuable time Tom.

No waste, I'm sure this topic will help someone :)

This is actually what I try to achieve all the time!

I wish there was an easier way to do this request: header widget to appear after nav menu (float right).

I've done this trick and it works, but is there a way to have this widget inside the header area?

Selecting after_header blows it out. See picture on what I am trying to achieve.
https://i.imgur.com/Ul8kD3E.png

https://elbertcountyagalliance.org

Hi there,

What if you add this CSS?:

.site-logo {
    float: left;
}

Thanks Tom!

You're welcome :)

This one worked for me

.inside-header {
display: flex;
flex-direction: column-reverse;
}