How to center align div even the width is 100%

Question

I am using a <div> container and set that container to 100%. Inside that container i have mentioned several <div> with 50% and it align to left side. Now my question is, whether can i center align the main container to align center. So that my inner container align to center. Please help me.

My html code is,

<div class="container">
     <div class="co1">
           <p>content</p>
     </div>
     <div class="co2">
           <p>content</p>
     </div>
</div>

My css code is,

.container{
width:100%;
}

.co1{
width:50%;
}

.co2{
width:50%;
}

possible duplicate of [How to center a div in a div - horizontally?](http://stackoverflow.com/questions/114543/how-to-center-a-div-in-a-div-horizontally) — Klaus Byskov Pedersen, Aug 22 '13 at 09:41

score 1 · Answer 1 · answered Aug 22 '13 at 09:41

1

Use margin CSS property to centralize the Div.

For instance

margin: 0 auto;

answered Aug 22 '13 at 09:41

Nitesh

15,425
4
48
60

score 0 · Answer 2 · answered Aug 22 '13 at 09:41

0

margin-left:0 auto;
margin-right:0 auto;

answered Aug 22 '13 at 09:41

SaturnsEye

6,297
10
46
62

score 0 · Answer 3 · answered Aug 22 '13 at 09:42

0

Yes, this is done with the auto margins which work horizontally only:

Add the following to your CSS for the 2 DIVs inside.

margin: 0 auto;

answered Aug 22 '13 at 09:42

Alexis Wilke

19,179
10
84
156

score 0 · Answer 4 · answered Aug 22 '13 at 09:47

0

You need to set margins to auto.

margin-left : auto;
margin-right : auto;

answered Aug 22 '13 at 09:47

Rajdeep Singh

17,621
6
53
78

How to center align div even the width is 100%

4 Answers4