Center align div inside div?

Question

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>  

Answer 1

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>  

Answer 2

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