title: Bootstrap 3 square tile display
body: <p>Using Bootstrap 3, I want to have square tiled menu that looks like Bootstrap's thumbnail (<a href="http://getbootstrap.com/components/#thumbnails" rel="noreferrer">http://getbootstrap.com/components/#thumbnails</a>). The code there to get tiled display is:</p>
  
  <pre><code>&lt;div class="col-md-3 col-sm-4 col-xs-6"&gt;
    &lt;a href="#x" class="thumbnail"&gt;
      &lt;img src="http://placehold.it/250x250" alt="Image" class="img-responsive"&gt;
    &lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I just want to replace the img placeholder as (vertically aligned) html text. Hence, I thought I can just do the following:</p>
  
  <pre><code>&lt;div class="col-md-3 col-sm-4 col-xs-6"&gt;
    &lt;a href="#x" class="thumbnail purple"&gt;Homepage&lt;/a&gt;
  &lt;/div&gt;
  &lt;div class="col-md-3 col-sm-4 col-xs-6"&gt;
    &lt;a href="#x" class="thumbnail purple"&gt;View Profile&lt;/a&gt;
  &lt;/div&gt;
  &lt;div class="col-md-3 col-sm-4 col-xs-6"&gt;
    &lt;a href="#x" class="thumbnail purple"&gt;Something 2 lines&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And this is what I got:</p>
  
  <p><img src="https://i.stack.imgur.com/hrsDL.png" alt="enter image description here"></p>
  
  <p>The placeholder examples have each tile dynamically shaped to stay as square tiles, and I want mine, in html/css/js, to be that way too. Is it possible, or do I have to use an img there? </p>