Move Header Image

• 

  upsilonmuzeta · Member · Jul 13, 2017 at 2:40 pm

  • Copy link
  • Add topic to favorites

  How do I move the header image between the Site Logo and the menu in CSS?

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Jul 13, 2017 at 9:24 pm

  • Copy link

  Hi there, we can do this, but the one thing I have to mention is that Internet Explorer version 9 and before do not support this change, so anyone on 9 or older will not see this change. Add this to the bottom of your custom CSS.

  .image-header {
  	display: flex;
  	display: -webkit-box;
  	display: -moz-box;
  	display: -ms-flexbox;
  	display: -webkit-flex;
  	-webkit-flex-direction: column;
  	-moz-flex-direction: column;
  	-ms-flex-direction: column;
  	flex-direction: column;
  	-webkit-box-orient: vertical;
  	-moz-box-orient: vertical;
  	-ms-box-orient: vertical;
  	box-orient: vertical;
    margin-top: 10px;
  }
  .site-logo-link {
  	-webkit-box-ordinal-group: 1;
  	-moz-box-ordinal-group: 1;
  	-ms-flex-order: 1;
  	-webkit-order: 1;
  	order: 1;
  }
  .image-header-flexible {
  	-webkit-box-ordinal-group: 2;
  	-moz-box-ordinal-group: 2;
  	-ms-flex-order: 2;
  	-webkit-order: 2;
  	order: 2;
  }
  .site-title {
  	-webkit-box-ordinal-group: 3;
  	-moz-box-ordinal-group: 3;
  	-ms-flex-order: 3;
  	-webkit-order: 3;
  	order: 3;
  }
  .site-description {
  	-webkit-box-ordinal-group: 4;
  	-moz-box-ordinal-group: 4;
  	-ms-flex-order: 4;
  	-webkit-order: 4;
  	order: 4;
  }