WordPress.org

Ready to get started?Download WordPress

Forums

How to remove the blank space between menu and page content in Twenty Eleven (18 posts)

  1. GICespjs
    Member
    Posted 2 years ago #

    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

  2. peredur
    Member
    Posted 2 years ago #

    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

  3. GICespjs
    Member
    Posted 2 years ago #

    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

  4. peredur
    Member
    Posted 2 years ago #

    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

  5. GICespjs
    Member
    Posted 2 years ago #

    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

  6. GICespjs
    Member
    Posted 2 years ago #

    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

  7. peredur
    Member
    Posted 2 years ago #

    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

  8. peredur
    Member
    Posted 2 years ago #

    Gap

    You could also do this:

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

    Cheers

    PAE

  9. GICespjs
    Member
    Posted 2 years ago #

    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

  10. peredur
    Member
    Posted 2 years ago #

    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

  11. GICespjs
    Member
    Posted 2 years ago #

    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

  12. peredur
    Member
    Posted 2 years ago #

    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

  13. GICespjs
    Member
    Posted 2 years ago #

    Thank you.

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

    Thank you again

  14. peredur
    Member
    Posted 2 years ago #

    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

  15. GICespjs
    Member
    Posted 2 years ago #

    Thank you very much for all your help

  16. peredur
    Member
    Posted 2 years ago #

    De nada.

    PAE

  17. shikha25
    Member
    Posted 1 year ago #

    Hi,

    I am facing a similar in my website
    http://www.myholidayidea.com

    I am not able to reduce the white space between page title and the content

    Can anyone kindly help with this issue

  18. peredur
    Member
    Posted 1 year ago #

    You should start a new thread for this, so don't answer this...

    You have a very deep, visually empty paragraph after your heading. It's only content is line breaks and illegal meta tags. Your home page has 53 HTML validation errors.

    Get your HTML right and I'm sure your problems will go away. But if you still have a problem, please post in a new thread.

    HTH

    PAE

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.