WordPress.org

Support

Support » Themes and Templates » How to remove the blank space between menu and page content in Twenty Eleven

How to remove the blank space between menu and page content in Twenty Eleven

  • Hi,

    I know this has been asked before but I can’t figure it out on my blog.

    I’m using Twenty Eleven theme and the blank space between the menu and the page content is huge.

    My blog is:
    GICEspjs

    Thank you very much

Viewing 15 replies - 1 through 15 (of 17 total)
  • peredur
    Participant

    @peredur

    Your link just leads to a “Coming soon” page, so we can’t tell anything from it.

    If you want to alter a default theme like twenty eleven, you must do it in a Child Theme. Otherwise your changes might be overwritten by a WordPress update.

    Cheers

    PAE

    Thanks.
    My link is publicly visible now. My apologies.
    Thank you for your advice on the Child Theme.
    Could you still help me with my previous question?
    Thank you so much

    peredur
    Participant

    @peredur

    There are a couple of things that make the gap. The main one is probably:

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

    You can get rid of that by adding the following rule to your (child) theme’s style sheet:

    #main {
      padding: 0;
    }

    If you want to get rid of even more space, post again.

    HTH

    PAE

    By the way I’ve made my changes in the original theme, because I didn’t know about the child theme.
    What do I do now?
    Shall I create a child theme and copy the style.css and all the files I’ve changed in the original theme?
    Thank you again

    Thanks for your previous answer.
    However, I would like every page to have as little space between the menu and the content as the homepage (“destaques”), because it is still very big.
    I’d really appreciate your help.

    Thanks

    peredur
    Participant

    @peredur

    Child Theme

    Your problem is that you’ve modified a default theme. So an update to WP could undo all your changes. Not every update will do that. Indeed, most won’t. So some people decide to risk it.

    If you want to move to a child theme, you should make a minimal one, by following the documentation, that imports the parent theme’s style sheet into its own one. Then you can copy all the rules you’ve modified into the child’s style sheet, after the import statement. Once you’ve done that, you can copy all your changed template files into the style sheet’s directory.

    Having done all that, you can download a new copy of the twentyeleven theme and replace the altered one with it.

    When you activate your child theme, you’ll need to redo any theme configurations you did, such as altering the header image and assigning a custom menu as the primary navigation menu.

    HTH

    PAE

    peredur
    Participant

    @peredur

    Gap

    You could also do this:

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

    Cheers

    PAE

    Thank you so much for all your time and help.
    I did what you told me, but the space is still the same.
    Do you have any more ideas?

    Thank you once again

    peredur
    Participant

    @peredur

    When I view your page, there is a max of about 5mm between the first post title and the menu. It was a lot more than that before.

    So the question is, what are *you* seeing? Is it different?

    Cheers

    PAE

    The thing is I wanted all the other pages to have that space, not only the homepage where my posts are.
    For instance, the “O que é o GIC” page has a huge space between the menu and the content.
    I hope it’s clearer now.
    Thank you very much

    peredur
    Participant

    @peredur

    These are the rules that are causing the gap on the page you refer to:

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

    and:

    .entry-content, .entry-summary {
      padding: 1.625em 0 0;
    }

    And in these cases, it is the .hentry and .entry-content classes that are relevant. Adding a rule like this should remove it:

    .hentry, .entry-content {
      padding: 0;
    }

    The way to do this yourself, is to use Firebug or similar to examine the rules that are causing the behaviour you want to alter, and the selectors that they apply to.

    HTH

    PAE

    Thank you.

    But where do I paste it?
    After the first rule you mentioned?

    Thank you again

    peredur
    Participant

    @peredur

    Anywhere, as long as it comes later in the cascade than the original rule. So just adding it to the end of your (child) theme’s style sheet will usually work.

    What I meant by mentioning the way to do it yourself, was how to identify the relevant rules.

    Cheers

    PAE

    Thank you very much for all your help

    peredur
    Participant

    @peredur

    De nada.

    PAE

Viewing 15 replies - 1 through 15 (of 17 total)
  • The topic ‘How to remove the blank space between menu and page content in Twenty Eleven’ is closed to new replies.