title: avoid overflow of inner div's if it exceeds the size of outer div and display them in next line
body: <p>I don't know how to phrase my problem 
  but here is my issue
  i have a outer div of size 900px 
  and inside that div i have 8 inner div each of size 250px 
  so on each line i can have only 3 div and the rest of div has to come on next line but i am not getting how to do this. 
  here is my code </p>
  
  <pre><code> &lt;div class="big"&gt;
                          &lt;div class="wrapper"&gt;
                              &lt;a href="#"&gt;&lt;div&gt;&lt;/div&gt;&lt;/a&gt;
                          &lt;/div&gt;
                           ....some more div
                           ....
  &lt;/div&gt;
  </code></pre>
  
  <p>and here is my css code</p>
  
  <pre><code> .big{
           display:-webkit-box;
           width:900px;
      }
  .wrapper {
    width: 250px;
    height: 250px;
      background-color:red;
      margin-right:2px;
  }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/sabaShaikh/qtujvLkx/" rel="nofollow">jsfiddle</a></p>
  
  <p>please help me with this</p>