How to Center a Logo in a Header div?

Discussion in 'CSS' started by SFNUM8, Jan 28, 2009.

  1. #1
    I am making a fixed layout, but I would like the logo in the header to be centered, and be fluid. I want the logo to be in the center of the header no matter what the resolution is.
    HTML
    <div id="header">
    <div id="logo">

    <h1 ><img src="images/logo.gif"/></a></h1>
    </div>
    </div>

    CSS
    #logo h1 {
    ????????
    }
    #header {
    width: 100%;
    height: 170px;
    ???????????

    }



    Thanks in advance
     
    SFNUM8, Jan 28, 2009 IP
  2. dlb

    dlb Member

    Messages:
    203
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    35
    #2
    #logo h1 img { margin:0 auto; display:block; }

    You may need to set the width of the image and if so you should be able to remove the 'display:block' tag.
     
    dlb, Jan 29, 2009 IP
    eric.r likes this.