Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Nov 2010
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Footer isn't centered

    At the bottom of the website it appears as if the footer isn't centering.


    http://www.organicgardencafe.com/index.php



    This is the css for the footer.

    #footer{
    text-align:center;
    height:30px;
    width:980px;

    }



    Probably a simple fix, but I can't catch it.

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,739
    Thanks
    22
    Thanked 1,836 Times in 1,820 Posts
    To center an element you need three things:
    1. a valid DocType
    2. an element with a width
    3. that elements left/right margins set to auto

    Try making your CSS look like this -
    Code:
    #footer {
    text-align:center;
    height:30px;
    width:980px;
    margin: 0 auto;
    background: #ff0; /*just for demonstration*/
    }
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #3
    New to the CF scene
    Join Date
    Nov 2010
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thank you. I just had to add and the footer centers perfectly now.
    margin: 0 auto;

  • #4
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,739
    Thanks
    22
    Thanked 1,836 Times in 1,820 Posts
    Very cool. Looks much better.
    Is that your site? It's interesting, I sent it to my sister who is a vegetarian.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •