缩略图类超出了它的内容

Question

我正在尝试将图像放在缩略图类中，但它（缩略图）在左侧和右侧的内容过多。 这是一个屏幕截图： Screenshot

这是代码（包括bootstrap）：

<div class="thumbnail">
  <img class="img-responsive" src="http://www.stutteringhelp.org/sites/default/files/pictures/alan-turing.jpg" alt="Alan Turing">
  <p class="text-center">Alan Turing: The codebreaker who saved millions of lives.</p>
</div>

Answer 1

  

为了对齐缩略图

我使用bootstrap的网格系统为图像和文本创建一行，并在每一侧放置两个更小的空列。

  

为了裁剪缩略图以填充其内容

我做了Abhishek Pandey建议的（第二个建议）。那就是：

.thumbnail {
    display: inline-block;
}

但是由于图像太小，我认为重新设计我的页面比单独留在中间更好。