Ion Ungurean Ion Ungurean - 4 months ago 19
Javascript Question

How can I set height for Twitter bootstrap thumbnails?

I’m having trouble setting up the Thumbnail module for my personal website. I use twitter bootstrap (3.0) for my project and I can’t finish setting up the Thumbnail module.

The width is okay, but I can’t set the height of thumbnails (I can’t align all thumbnails as the same height).

How I can set one (standard) height for all the thumbnails and zoom/scale image to center so they can fill all space without stretching the image?

<div class="row">
<!-- Thumbnail 0 -->
<div class="col-sm-6 col-md-3">
<a href="#" class="thumbnail">
<img src="img.png" alt="...">
</a>
<div class="caption">
<h4>Arctic MX-2, 8g</h4>
</div>
</div><!-- /thumbnail 0 -->
<!-- Thumbnail 1 -->
<div class="col-sm-6 col-md-3">
<a href="#" class="thumbnail">
<img src="blue.png" alt="...">
</a>
<div class="caption">
<h4>Arctic MX-2, 8g</h4>
</div>
</div><!-- /thumbnail 1 -->
</div><!-- /thumbnail -->

Answer

either in css:

.thumbnail img { min-height:50px; height:50px; } // or whatever height you desire

or inline:

<img src="img.png" alt="..." style="min-height:50px;height:50px;" />