title: child with 100% width in padding applied parent
body: <p>I have a <code>div</code> with this css specifications:</p>
  
  <pre><code>width:200px;
  padding:5px
  border:1px solid
  </code></pre>
  
  <p>and another <code>div</code> as it's child with this css:</p>
  
  <pre><code>width:100%
  border:1px solid
  </code></pre>
  
  <p>and these divs has rendered in FF and IE like this:<br>
  <img src="https://i.stack.imgur.com/zi3U6.png" alt="enter image description here"></p>
  
  <p>But it seems the right padding is less than left one! can any one tell me why this behavior causes?<br>
  Thanks </p>