• HennyNL

    (@hennynl)


    I use theme Twenty Eleven. How can I make the space above the header image (white space with blog title and subtitle) smaller (less hight) or remove it completely?

    (I created it child theme, with a style.css file)

Viewing 12 replies - 1 through 12 (of 12 total)
  • esmi

    (@esmi)

    Unless you provide a link to a page demonstrating the problem, no one will be able to offer much in the way of assistance.

    Thread Starter HennyNL

    (@hennynl)

    OK, thank you, the link is https://www.hennycramers.nl/blog.

    It isn’t a problem (in a sense that things don’t work like they should), more that I would like to adapt the standard lay-out (and as WP & CSS newbie don’t know how to do that)

    esmi

    (@esmi)

    I’d suggest that you try using Firefox with the Firebug add-on for this kind of work. It will help you to track down the CSS that needs changing in the child theme.
    https://getfirebug.com/

    Thread Starter HennyNL

    (@hennynl)

    Wow, that’s a supertool, thank you. What I can see now is that I should change the size of the header, esp. the area of the site-title and the site-description. What I can’t find is where the size of this area is defined. Can anybody help?

    esmi

    (@esmi)

    Add

    #branding hgroup {
    position:absolute;
    top:-9999px;
    left:-9999px;
    }

    to your child’s stylesheet.

    Thread Starter HennyNL

    (@hennynl)

    OK, thank your. But now it’s completly gone, see https://www.hennycramers.nl/blog
    My purpose is to make it smaller. So to adept the height of the area that now has disappeared.
    An example of a “trimmed” site-title & side-description area I found here: https://www.magnumfinancial.co.uk/

    WilliamJames

    (@williamjames)

    If you haven’t resolved this yet ~ I have just carried out the same adjustment on a Twenty Eleven themed site. In the style.css sheet, scroll to the Header section and adjust both (for a decrease in whitespace above AND below the Site Title); the #site-title and #site-description padding which begin 3.656…. I bought mine down to 1.656… and I’m really pleased – good Luck!

    Thread Starter HennyNL

    (@hennynl)

    Hi William, thank you for your comment. I already solved it. This is what did it for me:

    #hgroup {
    height: 261px
    }

    #site-title {
    margin-top: 21px;
    padding: 0.35625em 0 0;
    }
    #site-description {
    padding: 0.35625em 0 0;
    margin: 0 270px 1.65625em 0;
    }

    Lower padding em alone wasn’t suffici?nt. And I will look again, maybe I wasn’t adepting the code in the right section.
    Can you post the URL of your website, I’m curious to see the result.
    Mine you van find in a post above.

    PS it is recommended not to make changes in the CSS files of the standard theme, but to create a child theme. It is easy to do, if you didn’t!

    WilliamJames

    (@williamjames)

    My site can be found here :- it is a recently started project, and unlike my usual work I am taking this at a steady pace. I am hoping to perfect the css for the nav bar with help from this forum – and also plan on using jquery rounded to finish it off –

    WilliamJames

    (@williamjames)

    Thread Starter HennyNL

    (@hennynl)

    Hi William, thanks for the link, nice layout. I see you also eliminated the header picture. Succes with the project!

    WilliamJames

    (@williamjames)

    Thanks!

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘Change or eliminate space above header image’ is closed to new replies.