WordPress.com

1. msmidt
   Member
   Oct 4, 2012, 7:07 PM

   I'm a WordPress newbie and am trying to reduce the empty white space above and below the twentyeleven menu and the Page title and other content.

   The site I am working on is:
   http://eaglesonblondeau.com/

   Specifically, I would really like to reduce the space below the menus and the first headline "Available soon." Secondarily, I would like to reduce the space above the header photo and the name of the blog.

   Any suggestions or help would be much appreciated. Thanks for your consideration.

   The blog I need help with is eaglesonblondeau.com.

2. zandyring
   Happiness Engineer
   Oct 5, 2012, 12:43 PM

   To remove the space between your menu and your top article, add this to your CSS style sheet:

   .singular.page .hentry {
       padding: 0;
   }

   Then, to adjust the padding at the top, under the tag and above the image, add this:

   #site-description {padding-bottom: 1em;}

   You can change the 1em to whatever spacing looks right to you - you can do decimals, like .8em or 1.2em, or whatever.

   You didn't ask for this, but if you want to further reduce the padding between the title and the top of the content area, do this:

   #site-title {padding-top: 1em;}

   Good luck!
   -Z

3. msmidt
   Member
   Oct 8, 2012, 2:41 PM

   Thanks so much! This all seems to be helping.

   Here is what it looks like now:
   http://eaglesonblondeau.com/

   Two questions, if you would indulge me:
   1) I think there is still a lot of space between the tagline ("Distinctive downtown living...") and the image. What would be the coding to reduce this space?

   2) How do you find out all these codes for the different themes?

   Thanks again.

   -- Mark

4. zandyring
   Happiness Engineer
   Oct 8, 2012, 3:47 PM

   Mark,

   To reduce that space, you want to target the bottom margin of your site description:

   #site-description {margin-bottom: 0;}

   You can increase that number if you want, but that will get you to zero margin at least.

   If you don't see a change, add an "important" note to it, like so:

   #site-description {margin-bottom: 0 !important;

   I use Firefox primarily, so I look at the code using Firebug. It's an add-on that you can easily install on Firefox - just do a quick search for it, or look in Tools/Add Ons.

   Good luck!
   -Z

5. msmidt
   Member
   Oct 8, 2012, 3:59 PM

   You are the best!

   I'll have to look at the code and see what I can figure out.

   Thanks again.

   -- Mark

6. zandyring
   Happiness Engineer
   Oct 8, 2012, 4:10 PM

   It takes some getting used to, but it can be really fun once you get rolling. My recommendation is to just keep playing with it - that's the best way to get used to it. As obvious as it sounds...

Topic Closed

This topic has been closed to new replies.