CODEWITHSUNDEEP
css
Zo Has
Zo Has

Reputation: 13038

Center align div inside div?

How do I center align 3 floating divs inside each other centered on page ?

<div style="width:100%">
     <div style="width:90%">
           <div style="width:80%">
                //Content
           </div>
     </div>
</div>

Upvotes: 5

Views: 38035

Answers (2)

socha23
socha23

Reputation: 10239

Use margin: auto in CSS.

<div style="background-color: red; height: 100px; width: 500px; margin: auto;">
     <div style="background-color: green; height: 100px; width: 300px; margin: auto;">
           <div style="background-color: blue; height: 100px; width: 100px; margin: auto;">
                //Content
           </div>
     </div>
</div>

Upvotes: 15

Joakim Johansson
Joakim Johansson

Reputation: 3194

If the element you're centering has a specified width, you can center it with margin: 0 auto

Upvotes: 3

Related Questions