Move Header image to right of logo

• 

  standardtechnologyblog · Member · May 25, 2017 at 7:34 pm

  • Copy link
  • Add topic to favorites

  I would like to move the header image to the right of the logo at the top of the page.

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

• 

  thesacredpath · Member · May 25, 2017 at 8:53 pm

  • Copy link

  Hi, the way the header area is structured, this would not work well as the logo and he menu are in one div, and that is inside of a parent div that includes the header image, so trying to get thing aligned and looking good on all screen sizes would be problematic.

  This isn’t what you asked for, but add the following to your custom CSS and see what you think. It centers the navigation and also the logo on screens 910px and wider (before the touch device menu activates) and adjusts a bit of the spacing on things.

  @media screen and (min-width: 910px) {
  	.site-branding {
  		margin-left: auto;
  		margin-right: auto;
  	}
  	#site-header-menu {
  		text-align: center;
  		margin-bottom: 0;
  	}
  	#site-header-menu ul {
  		display: inline-block;
  	}
  	.site-header {
  		padding-top: 2.5em;
  	}
  }

  Let me know what you think.

• 

  standardtechnologyblog · Member · May 25, 2017 at 10:44 pm

  • Copy link

  I like it. Thank you.

• 

  thesacredpath · Member · May 26, 2017 at 7:27 pm

  • Copy link

  Hooray and you are welcome!