WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] TwentyEleven: How to reduce whitespace below menu and Page Title (20 posts)

  1. christdp
    Member
    Posted 2 years ago #

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

    Here's the site I'm beginning to create.

    A few things I've already modified in my twenty eleven child theme include:

    • Removing the default twenty eleven header images and uploading and using a custom header image in place of the Site title text.
      I did this by modifying child theme file functions.php using these techniques.
    • Resizing the header image using the Resize Twenty Eleven Header plugin.

    I have searched all the forum posts on wordpress.org and tried several of the techniques to add css to the style.css file in my 2011 child theme but I am unable to reduce the vertical white space.

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

  2. Rev. Voodoo
    Volunteer Moderator
    Posted 2 years ago #

    If i'm not mistaken, that was on #main?

    I edited mine to this on voodoopress.com in my child theme

    #main {
    	clear: both;
    	padding: 0.625em 0 0;
    }

    I'm not 100% because I changed several things, and didn't take great notes

    http://vudu.me/p4

    Starting there, I have a bunch of info on working with twentyeleven if you want to see more info

  3. christdp
    Member
    Posted 2 years ago #

    Rev, thanks for the idea. I tried replacing the code I previously had in styles.css in my child twenty eleven theme but the spacing issue persists. I did check out your site - very good info there on several topics.

    Any other suggestions to eliminate the extra white space below the menu would be much appreciated.

  4. Rev. Voodoo
    Volunteer Moderator
    Posted 2 years ago #

    You don't have a twentyeleven child theme active!!!???

    I'm looking at your site, and you still have twentyeleven active, so no edits in your child theme will do anything....

    The child theme has to be the active theme for it to work.....

  5. christdp
    Member
    Posted 2 years ago #

    Thanks for taking a look and catching that. I will go back through the steps I performed to create the child theme and update the banner. When I activate the child theme, the site title and text are displayed instead of the custom banner graphic. I thought the process was to activate the 2011 theme and that it pulled in attributes from the child theme - sounds like I had that backwards.... sorry for my confusion - newbie pains.

  6. Rev. Voodoo
    Volunteer Moderator
    Posted 2 years ago #

    Yup, you had it backwards.

    Here's the deal.

    YOu never make edits to twentyeleven

    You make a child theme, and activate it. Any edits you make to your child theme take precedence over the parent theme. And by making edits in the child theme, your code stays safe

    http://vudu.me/child may have a little more info if you are interested

  7. gwytherinn
    Member
    Posted 2 years ago #

    I tried the solution at the bottom of this post, worked like a charm (as long as your child theme is activated). I even went a little overboard and specified -10, it sheared my post titles in half. :)

    http://wordpress.org/support/topic/theme-twenty-eleven-space-between-navigation-and-title?replies=4

  8. christdp
    Member
    Posted 2 years ago #

    I got the child them issue worked out and tried implementing both ideas in the post above into the updated style.css file in the child theme directory on the server. These didn't work for my site - not sure why.

    I was able to make the change using the techniques in the posting at http://wordpress.org/support/topic/twenty-eleven-theme-space-between-banner-and-post?replies=18.

    My issue is now resolved. Thanks for your help and suggestions.

  9. madverts
    Member
    Posted 1 year ago #

    Can anyone help me eliminate the extra space between the header and the video content on my webpage? Looks funny with such a big gap. Tried a lot of things but nothing has worked yet. Much appreciated.

    http://madverts.org/cpa

  10. jcolon
    Member
    Posted 1 year ago #

    The correct answer is:
    1. Go to your child theme style.css
    2. Add this line
    #main,.singular.page .hentry{padding:0;}
    3. Done.

  11. ijmacmurray
    Member
    Posted 1 year ago #

    Can I ask where exactly on the child theme style.css do you insert that suggestion?

  12. esmi
    Theme Diva & Forum Moderator
    Posted 1 year ago #

    Try adding it to the end of your child's stylesheet. Generally speaking, and unless you're specifically advised otherwise, the end of a stylesheet is always the best place for new CSS rules.

  13. ijmacmurray
    Member
    Posted 1 year ago #

    This is the style.css in my child theme :

    /*
    Theme Name:Twenty Eleven Child
    Version: 2.0
    Theme URI: http://quirm.net/themes
    Description: A basic starter child theme for Twenty Eleven
    Author: Mel Pedley
    Author URI: http://blackwidows.co.uk
    Template: twentyeleven
    
    /* Import layout */
    @import url(../twentyeleven/style.css);

    #main,.singular.page .hentry{padding:0;}

    So I place these changes here below this information.

  14. esmi
    Theme Diva & Forum Moderator
    Posted 1 year ago #

    Yes.

  15. ijmacmurray
    Member
    Posted 1 year ago #

    I placed the code above at the very end of style.css but there was no change in spacing. Here is a link to the site http://www2/mgpi.biz

    As you can see there is way too much space above and below the "Welcome to mgpi"
    Thanks
    Joanne

  16. ijmacmurray
    Member
    Posted 1 year ago #

    I'm so sorry about the link. It should be http://www2.mgpi.biz

  17. esmi
    Theme Diva & Forum Moderator
    Posted 1 year ago #

    Try also adding:

    .entry-title {padding-top:0;}

  18. ijmacmurray
    Member
    Posted 1 year ago #

    That seems to have helped but the pages without a sidebar (all other pages at this point) don't seem to be effected by this change.

  19. ijmacmurray
    Member
    Posted 1 year ago #

    The comment above should read - That seems to have helped the first page with the sidebar but the pages without a sidebar (all other pages at this point) don't seem to be effected by this change.

  20. elPatron
    Member
    Posted 1 year ago #

    This is what I did and it works fine

    #main,.entry-content{padding:0;}

    http://fuelab.accountsupport.com/

Topic Closed

This topic has been closed to new replies.

About this Topic