title: Creating a centered table with Bootstrap
body: <p>I have 20 icons and I want to make a centered horizontal line of images from them. But I can't use HTML table because I want it to be responsive. It should be wrapped for mobile users. By using HTML table I guess I should use 1 row and 20 columns, but it won't wrap for small screens.</p>
  
  <p>I created a group of divs like this. The view of this is OK. 
  <a href="http://jsfiddle.net/mayJ6/" rel="nofollow noreferrer">http://jsfiddle.net/mayJ6/</a></p>
  
  <pre><code>&lt;div style="display: inline-block; border: solid 1px black;"&gt;
      &lt;a href="http://www.example.com" target="_blank" &gt;
          &lt;img src="http://profile.ak.fbcdn.net/hprofile-ak-prn1/157940_262105851352_1630693163_q.jpg"
             width="50" height="50" alt="photo"/&gt;
      &lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>But <a href="https://stackoverflow.com/questions/14127150/why-bootstrap-uses-floats-on-span-instead-of-display-inline-block/14148240#14148240">this answer</a> tells not to use display inline block in this situation. Is there a better solution that looks similar, by using Twitter Bootstrap etc. ?</p>