等高列引导程序 3

Question

嘿，我在一个项目网站上工作，但我遇到了问题，列，

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<div class="row-eq-height">
  <div class="col-xs-4 col-md-4">
    <div class="thumbnail">
      <img src="img/seo.png" height="150" width="150">
      <div class="caption">
        <h4 class="text-center">SEO Services</h4><hr class="style-one">
        <h4 class="text-center">We provide you with SEO Services ,which will boost your site ranking on different search engine, Google,Yahoo,etc.</h4>
        <div class="text-right">
          <a href="#" class="btn btn-primary" >25$</a>
        </div>
      </div>
    </div>
  </div>


  <div class="col-xs-4 col-md-4 ">
    <div class="thumbnail">
      <img src="img/s2.png" height="150" width="150">
      <div class="caption">
        <h4 class="text-center">Websiite Templates</h4><hr class="style-one">
        <h4 class="text-center">Here we provide you with various different website templates,responsive, mobile interface enabled. as per your requirement.</h4> 
      </div>
    </div>
  </div>


  <div class="col-xs-4 col-md-4">
    <div class="thumbnail">
      <img src="img/s3.png" height="150" width="150">
      <div class="caption">
        <h4 class="text-center">hello</h4><hr class="style-on">
        <h4></h4>
      </div>
    </div>
  </div>
</div>

这是演示

我应该如何纠正这个。

Answer 1

为.thumbnail班级设置最小高度

.thumbnail {
    min-height: 330px;
}

对于溢出问题添加

.text-center {
    word-wrap: break-word;
}

小提琴 http://jsfiddle.net/8d8g7hyt/3/