Change height of header in Autofocus theme

  • Author
    Posts
  • #786685

    My header image is 800×380. The Autofocus theme only allows for a header of 800×216. I’d like to alter the head size to accommodate my header image. Is this possible, and if so, how can I do this? I am have very limited experience with HTML and CSS. Any help would be appreciated!

    I believe this is the code for the header image. I see where the width is defined but not the height.

    #header-wrapper,
    #header,
    #access,
    div.menu,
    #content,
    #sidebar,
    #comments,
    #footer {
    display: inline;
    float: left;
    position: relative;
    }
    #header-wrapper {
    width: 800px;
    }
    #header {
    padding: 24px 0 48px;
    width: 595px;

    The blog I need help with is nomadwithcookies.wordpress.com.

    #786795

    This is quite easy with Autofocus since it puts the custom header into the CSS rather than into the HTML. Upload the image to your media library, get the URL of that image, add the following to your CSS and then replace IMAGE URL between the double quote marks with the full URL of your image. I would add this to the very bottom of any CSS you have already used.

    #header-image {
    background: url("IMAGE URL") no-repeat scroll 0 0 transparent !important;
    height: 380px !important;
    }
    #786808

    Thank so much! Worked like a charm. :)

    #786820

    You are welcome.

The topic ‘Change height of header in Autofocus theme’ is closed to new replies.