Social Media Menu Bar

Hello authorjenna,

Please share the site url so we can help you as per the need.

Kind Regards,

Manoj

Sorry!

https://jennahoward.com

Hi @authorjenna, give this a try.

#masthead {
	display: flex;
	flex-direction: column;
	box-orient: vertical;
	display: -webkit-box;
	-webkit-flex-direction: column;
	-webkit-box-orient: vertical;
	display: -webkit-flex;
	display: -moz-box;
	-moz-flex-direction: column;
	-moz-box-orient: vertical;
	display: -ms-flexbox;
	-ms-flex-direction: column;	
	-ms-box-orient: vertical;
}
#masthead .custom-header {
	-webkit-box-ordinal-group: 1;
	-moz-box-ordinal-group: 1;
	-ms-flex-order: 1;
	-webkit-order: 1;
	order: 1;
}
#masthead .main-navigation {
	-webkit-box-ordinal-group: 2;
	-moz-box-ordinal-group: 2;
	-ms-flex-order: 2;
	-webkit-order: 2;
	order: 2;
}
#masthead .site-branding {
	-webkit-box-ordinal-group: 3;
	-moz-box-ordinal-group: 3;
	-ms-flex-order: 3;
	-webkit-order: 3;
	order: 3;
}

Just to let you know, although this advanced CSS3 is supported by the majority of modern browsers, in the case of Internet Explorer, it is only supported on version 10 and later, so anyone on 9 or earlier will not see this change.

That did work though I am getting some yellow exclamation alerts one claiming ‘Unknown property box-orient’and multiple Duplicate property ‘display’ found. Will those warnings matter in the long run or did I insert it in the wrong place? Currently in my Dara-Child style.css

Also is there any way to align it to the right?

Yeah, that can happen with the above code. There isn’t anything wrong with the code, I just attempted to cover all the bases I could so that the change would show on as many browser versions as possible.

Yup, the Dara Child style.css file is the place to put it, either that or at Customize > Additional CSS. Either place works.

Thank you this information was really helpful!

You are welcome.

I’m back with this. For whatever reason (I’m assuming it’s me mucking about) I lost my social media menu bar and yay, it’s back, but I’m pretty sure I had it closer the top menu bar and I have no idea how I figured that out. How do I close the distance between them?

Same domain: https://jennahoward.com

I had to restore my site because…things so no worry about this.