How do I reduce the margins around my custom logo header?

• 

  whodhavethought · Member · Feb 11, 2013 at 6:51 am

  • Copy link
  • Add topic to favorites

  I would like to reduce the amount of white space (margins), top and bottom of my header logo. How do I do this? The blog in question is http://blog.whodhavethought.com. Many thanks, Jane

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

• 

  dcoleonline · Staff · Feb 11, 2013 at 10:57 pm

  • Copy link

  Try using this CSS code. It should keep the space to the left and right of your logo, while removing the top and bottom spacing.

  #header {0px 30px;}

  One thing to note is that since your image itself includes a large white background which surrounds the actual logo, doing this won’t result in a drastic change. You might actually need to edit the image itself, by cropping off some of the top and bottom in order to have a shorter header to your site.

• 

  dcoleonline · Staff · Feb 11, 2013 at 10:58 pm

  • Copy link

  Sorry, a quick correction here:
  #header {padding: 0px 30px;}

  There, that should do it.

• 

  whodhavethought · Member · Feb 12, 2013 at 12:58 am

  • Copy link

  Thanks for your help – it’s looking better now. The only thing is it’s a bit left of centre even though I have centred it. Is there any way around this? Thanks, Jane

• 

  dcoleonline · Staff · Feb 12, 2013 at 1:17 am

  • Copy link

  No problem. It looks like when you used the newer, smaller image, it wasn’t the full width of the available space, so it’s left aligned. This likely happens by default.

  Anyway, this should get you what you need:
  #title-logo {text-align:center;}

• 

  whodhavethought · Member · Feb 12, 2013 at 1:26 am

  • Copy link

  Fantastic – its worked! Thanks so much for your help.

• 

  dcoleonline · Staff · Feb 12, 2013 at 3:44 pm

  • Copy link

  No problem!