Simple CSS annoyance. Centering Body of the web page.

Discussion in 'CSS' started by MafiaPenguin, Oct 30, 2010.

0
  1. #1
    Hi people,

    Just have an issue with my website which has been bothering me for a while now. Im trying to center the body of it and have had no luck.

    The link is www.filmhammer.com, if you could help me solve this issue i would be more than gratefull :)

    Thanks!
     
    MafiaPenguin, Oct 30, 2010 IP
  2. MakingThisSucked

    MakingThisSucked Greenhorn

    Messages:
    46
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    16
    #2
    I would go with

    You can also try wrapping your entire body element in <center> </center>.. i'm pretty sure it's depreciated, or not the best route.. but i've used it before and it works.

    Have you tried anything already?

    I just popped open firebug, and it showed you also have two places you specify CSS for the body element, in style.css line 16, and style.css line 1561. I don't think it's an issue to do that, i'm new though. Anyway, try those things and let me know if it works.
     
    MakingThisSucked, Oct 30, 2010 IP
  3. GardsJr

    GardsJr Member

    Messages:
    42
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    41
    #3
    Around you wrap around <div> that goes around what you want to center. 

    csselement {
margin: auto auto;
REST OF CODE
}
    Code (markup):
    Hope I helped.
     
    Last edited: Oct 30, 2010
    GardsJr, Oct 30, 2010 IP
  4. radiant_luv

    radiant_luv Peon

    Messages:
    1,327
    Likes Received:
    34
    Best Answers:
    1
    Trophy Points:
    0
    #4
    few specific div containers, add this
    
.art-contentLayout {
margin: 0 auto;
}
.art-InnerFooter {
margin: 0 auto;
}
    Code (markup):
     
    radiant_luv, Oct 30, 2010 IP
  5. AtomicPages

    AtomicPages Peon

    Messages:
    38
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5 
    .art-contentLayout {margin:auto;}
    Code (markup):
    Usually what I do when setting up my stylesheet is that I set the margin and padding for the html/body to 0 like this:
    
html, body {
     margin:0;
     padding:0;
}
    Code (markup):
    Then I set the body like this:
    
body {
     margin:0 auto; /*0 = top/bottom auto = left/right*/
     width:#px;
     background:transparent url(blah.jpg) fixed repeat;
}
    Code (markup):
    But the important thing to know is you want to set the left and right margins to auto. You can create a list is elements wish wish to give margin:auto to. Most of the time setting this in your body elements will solve most alignment issues. But it also depends on how you site was created as well..
     
    AtomicPages, Oct 31, 2010 IP