How do I center my logo and eliminate/minimize the padding?

• 

  maineicrepair · Member · Jan 29, 2017 at 7:48 pm

  • Copy link
  • Add topic to favorites

  How do I center my logo and eliminate/minimize the padding above and below the logo?

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

• 

  aakashpatelsite · Member · Jan 30, 2017 at 10:08 am

  • Copy link

  Hi,
  Your logo is in the left side of the page to make it in the center give margin-left in the custom-logo CSS of your page.
  Give margin according to your need.
  And for the padding, you have given padding of “3em” in the class named header-main of CSS, so to remove padding make it 0 or remove that class.

  Thanks,
  Aakash Patel

• 

  staff-loquaciousloon · Staff · Jan 31, 2017 at 5:22 pm

  • Copy link

  Hi @maineicrepair!

  To center the logo, you need a minor tweak to one of your current CSS styles (you were really close)

  Right now you have this:

  #site-branding {
  	float: none;
  	margin-left: auto;
  	margin-right: auto;
  	width: 230px;
  }

  Change that # into a . and it should center.

  site-branding is a class, not an ID, so you want to use a dot instead of a pound :)

  For the padding, you’ll use a style like this (this is what @aakashpatelsite was describing):

  .header-main {
  	padding: 0
  }

  for no padding, or

  .header-main {
  	padding: 1em 0;
  }

  for less padding. You can adjust the 1em up or down as needed (decimals are allowed!)

  Give those a try and let us know how it looks! :)

• 

  maineicrepair · Member · Jan 31, 2017 at 6:09 pm

  • Copy link

  Thank you both. I have it the way I want it now!

• 

  staff-loquaciousloon · Staff · Jan 31, 2017 at 7:41 pm

  • Copy link

  You’re welcome!