Header Alignment

Community Forums Forums Design Tips and Tricks Header Alignment

This topic is: not resolved

This topic contains 2 replies, has 2 voices, and was last updated by  Amesbury 1 year, 3 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #30449

    Amesbury
    Participant
    Post count: 6

    I am just building my site and my header image is not centered. It’s aligned with the top of the page for some reason. I followed the same size as requested.

    How do I get it to lie in the center?

    http://www.daybluedesigns.com/newsite

    #30478

    Charlie
    Participant
    Post count: 112

    OK I think I’ve got this. There’s a few changes to make to your stylesheet.

    We’re going to move the logo background image down by 27px using absolute positioning:
    [css]#header {
    background: url("http://daybluedesigns.com/newsite/wp-content/uploads/2013/03/header1.png&quot ;) no-repeat scroll center 27px transparent;
    }[/css]

    Then we’re going to increase the min-height of the header to accommodate the size of the image:
    [css]
    #header {
    margin: 0 auto;
    min-height: 167px;
    width: 1140px;
    }[/css]

    That’s it!

    #32648

    Amesbury
    Participant
    Post count: 6

    Thanks Charlie!

    I get what we’re doing, but where does the first piece of code go? Is it replacing this:
    #wrap {
    background: url(images/bg-header.jpg) repeat-x top;
    margin: 0;
    padding: 0;
    }

    or going in as new content?

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.