Oxygen Theme Header Width

  • mrskatystacy · Member ·

    I’d love for my header to blend seamlessly with my background, creating a solid ‘wall’ of the tiled wood – is this possible?

    I’d also like for the header image to reach the very top of the page, leaving no white space above it.

    I want to leave the white space below the header as well as the space to the left and right of the content on the rest of the page – aka I’m not trying to make the content for the entire length of the page narrower, rather just the header wider.

    I’m not sure I’m making what I want clear… but I tried.

    Thanks in advance for any help!

    The blog I need help with is: (visible only to logged in users)

  • hafizr · Staff ·

    Hi there,

    The following CSS might achieve what you wanted: 

    @media only screen and (min-width : 1024px) {
    /* Anchoring for the absolute positioned masthead */
    #page {
        padding-top: 220px;
        position: relative;
    }
    #masthead {
        padding-top: 0;
        position: absolute;
        top: 0;
        left: 0;
    }
    #masthead .main-navigation {
        margin-left: 30px;
    }
}

    Note that currently the effect only happen on desktop computers… When seen on tablets/smartphones, the spacing on top and to the sides of the header remain.

  • The topic ‘Oxygen Theme Header Width’ is closed to new replies.