Trouble centering <h2>'s

Discussion in 'CSS' started by IanT, Sep 5, 2010.

  1. #1
    Okay, Working on a new site:

    Http://www.LindleywoodDevelopment.com

    But I am having trouble with centering the headings, adding the text-align: center; attribute to the CSS will bring the heading closer to the center, but it does not line up the same with the footer and h1Logo and menu bar.... what am I missing?

    and yes, I am still a rookie :)

    Thanks for the help
     
    IanT, Sep 5, 2010 IP
  2. radiant_luv

    radiant_luv Peon

    Messages:
    1,327
    Likes Received:
    34
    Best Answers:
    1
    Trophy Points:
    0
    #2
    1. There is an unnecessary margin-right:160px; for div #content
    2. Set an width for div #content
    3. set left & right margin to auto

    #content{
    padding-top:0.5em;
    width:960px;
    margin:0 auto;
    }

    4. remove margin left (160px) for #content P

    #content p {
    margin:0;
    }

    5. add <h2>This is a header</h2> before <p>IMPSUMIMPLORUM LINDLEYWOOD ...

    6. remove margin, padding for #content h2 and add text-align:center

    #content h2 {
    clear:both;
    color:#FFFFFF;
    font:bold 120%/130% arial,helvetica,sans-serif;
    margin:0 0 0 160px; <!-- remove-->
    padding:0 0.8em 0.4em;<!-- remove-->
    text-align:center; <!--add->
    }
     
    radiant_luv, Sep 5, 2010 IP
  3. IanT

    IanT Well-Known Member

    Messages:
    503
    Likes Received:
    11
    Best Answers:
    0
    Trophy Points:
    130
    #3
    haha! it worked! you rock! thank you so much!
     
    IanT, Sep 5, 2010 IP