CSS How to center a div horizontally

Question

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;

}

Possible duplicate: http://stackoverflow.com/questions/618097/how-do-you-easily-horizontally-center-a-div-using-css — Boaz, Feb 11 '13 at 21:39
Nope. That link does not help at all. If you look closely you will see I already applied the answers from that example and still not getting the desired result. — Kobojunkie, Feb 11 '13 at 21:48
see my answer on this [enter link description here](http://stackoverflow.com/questions/618097/how-do-you-easily-horizontally-center-a-div-using-css/43509117#43509117) — amachree tamunoemi, Apr 20 '17 at 02:37

score 6 · Answer 1 · edited Feb 11 '13 at 21:43

6

margin:0px auto;

if the div is positioned absolute or fixed then use

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

edited Feb 11 '13 at 21:43

Roddy of the Frozen Peas

14,380
9
49
99

answered Feb 11 '13 at 21:41

user2055453

65
5

score 3 · Accepted Answer · answered Feb 11 '13 at 21:40

3

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.

answered Feb 11 '13 at 21:40

MGDTech

522
3
11

Whats here http://www.w3schools.com/css/css_align.asp seems more simple, that is what I used. Thanks for the link, wasn't aware of such a site, the jquery book is very useful :) – Benj Aug 15 '14 at 22:37
1

You should always include the informations from the linked article in your post in case the link dies. – Black Aug 27 '18 at 09:14

score 0 · Answer 3 · answered Feb 11 '13 at 21:42

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!

CSS How to center a div horizontally

3 Answers3

Linked