Centering a Fixed Div

Discussion in 'CSS' started by Erind, Jan 24, 2008.

  1. #1
    Hey All,

    I put up a fixed header (doesn't scroll with page). position:fixed, sticks it to the top left. I want it centered. Anyone have any idea?
     
    Erind, Jan 24, 2008 IP
  2. Dondon2d

    Dondon2d Peon

    Messages:
    3,193
    Likes Received:
    146
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Use margin: 0 auto;

    Dunno, lol.
     
    Dondon2d, Jan 24, 2008 IP
  3. dnbox

    dnbox Peon

    Messages:
    108
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #3
    yes :) margin: 0 auto;
     
    dnbox, Jan 25, 2008 IP
  4. soulscratch

    soulscratch Well-Known Member

    Messages:
    964
    Likes Received:
    45
    Best Answers:
    0
    Trophy Points:
    155
    #4
    Uh.. as far as I know horizontal auto margins only work on static positioned block level elements that aren't intristic (image, table).

    One solution would be to set left to 50% and a margin-left equal to half of the element's width, if it has a fixed width. Demo below.

    http://www.soulscratch.com/playground/css/centering-elements.html
     
    soulscratch, Jan 25, 2008 IP
  5. nicangeli

    nicangeli Peon

    Messages:
    828
    Likes Received:
    23
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Wouldn't you use the following:

    
    div#header
    {
    padding: 0;
    margin: auto;
    text-align: center;
    
    }
    
    Code (markup):
    N.B. the text align is for ie.
     
    nicangeli, Jan 25, 2008 IP