How can I make a DIV inside a DIV using 90% width?

Question

I've tried this:

<div style="padding: 1rem 0;background-color:red">
   <div style="width: 90%;margin: 0 auto 0 auto; background-color:red">
   xxx
   </div>
</div>

But the inner DIV takes up enough space for xxx. How can I make the inner DIV have 90% of the outer width?

+3

Samantha jt star 22 oct. 14 at 6:05

1 answer

Akshay · Accepted Answer · 2014-10-22T06:08:22+0000

It works great, you can't see that since both have red background color, I changed it to green to see this http://jsfiddle.net/vm3b350r/ .

<div style="padding: 1rem 0;background-color:red">
  <div style="width: 90%;margin: 0 auto 0 auto; background-color:green">
    xxx
  </div>
</div>