CODEWITHSUNDEEP
htmlcss
Kobojunkie
Kobojunkie

Reputation: 6545

CSS How to center a div horizontally

I am working on centering a div horizontally. I have the following code to center my div in the body tag both vertically and horizontally, but seems just the vertical piece works. How can I get the horizontal piece to work as well. Thanks in advance. 

body
{
    background-color: #081418;
    font-size: .75em;
    font-family: Verdana, Helvetica, Sans-Serif;
    margin: 0;
    padding: 0;
    color: #696969; 
    text-align: center;
}

.OuterRim
{
    border:5px solid #99D7C0;
    height: 97%;
    width: 85%;
    /*center aligning*/ 
    display: block;
    text-align: left;
    margin: 0px auto;

}

Upvotes: 3

Views: 28172

Answers (3)

user2055453
user2055453

Reputation: 65

margin:0px auto;

if the div is positioned absolute or fixed then use

margin:0px auto;
left:0;
right:0;

Upvotes: 6

Raphael Rafatpanah
Raphael Rafatpanah

Reputation: 19967

http://jsfiddle.net/persianturtle/jm7vF/1/

I believe this may solve your problem if I understand it correctly.

I placed a container div around your div and put percentage margins all around.

.container {
height: 50%;
margin: 25% 25% 25% 25%;
}

Hope this helps!

Upvotes: 0

MGDTech
MGDTech

Reputation: 552

Take a look here at this tutorial to learn how to do it. You need to have an element with a fixed width. This can be done with css or jquery.

Upvotes: 3

Related Questions