Question

我过去几周在网站上遇到了一个问题。我有一个Bootstrap网格，每行有三个容器，在整个网格中包含3行。 9个容器中有2个比其他容器短。

我试过的事情：

创建高度相同的图像
在css中强制相同的高度

到目前为止，这些都没有奏效...... 这个问题可以在这里看到：https://www.tensorflow.org/api_docs/python/tf/losses/softmax_cross_entropy 或者在这里：https://pawalter.psu.edu/topics

包含Bootstrap网格的节点（drupal 7站点）的代码是：

<div class="container">
  <div class="row">
    <div class="col-md-4">
      <div class="thumbnail">
        <a href="https://pawalter.psu.edu/topics/agriculture">
          <img src="<?php $theme_path = drupal_get_path('theme', variable_get('theme_default',NULL));
          print $theme_path;
          ?>/images/Ag.jpg" alt="Agriculture" >
          <div class="caption">
            <h4>Agriculture</h4>
          </div>
        </a>
      </div>
    </div>
    <div class="col-md-4">
      <div class="thumbnail">
        <a href="https://pawalter.psu.edu/topics/bluffmanagement">
          <img src="<?php $theme_path = drupal_get_path('theme', variable_get('theme_default',NULL));
          print $theme_path;
          ?>/images/Bluff-mgmt.jpg" alt="Bluff Management" >
          <div class="caption">
            <h4>Bluff Management</h4>
          </div>
        </a>
      </div>
    </div>
    <div class="col-md-4">
      <div class="thumbnail">
        <a href="http://pawalter.psu.edu/topics/invasivespecies">
         <img src="<?php $theme_path = drupal_get_path('theme', variable_get('theme_default',NULL));
          print $theme_path;
          ?>/images/Invasives.jpg" alt="Invasive Species" >
          <div class="caption">
            <h4>Invasive Species</h4>
          </div>
        </a>
      </div>
    </div>
  </div>

  <div class="row">
    <div class="col-md-4">
      <div class="thumbnail">
        <a href="https://pawalter.psu.edu/topics/policyandgovernance">
         <img src="<?php $theme_path = drupal_get_path('theme', variable_get('theme_default',NULL));
          print $theme_path;
          ?>/images/Policy.jpg" alt="Policy" >
          <div class="caption">
            <h4>Policy &amp Goverance</h4>
          </div>
        </a>
      </div>
    </div>
    <div class="col-md-4">
      <div class="thumbnail">
        <a href="https://pawalter.psu.edu/topics/presqueislebay">
           <img src="<?php $theme_path = drupal_get_path('theme', variable_get('theme_default',NULL));
          print $theme_path;
          ?>/images/PIB.jpg" alt="Presque Isle Bay" >
          <div class="caption">
            <h4>Presque Isle Bay</h4>
          </div>
        </a>
      </div>
    </div>
    <div class="col-md-4">
      <div class="thumbnail">
        <a href="https://pawalter.psu.edu/topics/reservationandconservation">
          <img src="<?php $theme_path = drupal_get_path('theme', variable_get('theme_default',NULL));
          print $theme_path;
          ?>/images/Rest-and-Cons.jpg" alt="Restoration & Conservation" style="">
          <div class="caption">
            <h4>Restoration &amp Conservation</h4>
          </div>
        </a>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-md-4">
      <div class="thumbnail">
        <a href="https://pawalter.psu.edu/topics/stormwatermanagement">
           <img src="<?php $theme_path = drupal_get_path('theme', variable_get('theme_default',NULL));
          print $theme_path;
          ?>/images/Stormwater.jpg" alt="Stormwater Management" >
          <div class="caption">
            <h4>Stormwater Management</h4>
          </div>
        </a>
      </div>
    </div>
    <div class="col-md-4">
      <div class="thumbnail">
        <a href="https://pawalter.psu.edu/topics/water-and-land">
           <img src="<?php $theme_path = drupal_get_path('theme', variable_get('theme_default',NULL));
          print $theme_path;
          ?>/images/Water-and-LU.jpg" alt="Water and Land Use Planning" >
          <div class="caption">
            <h4>Water and Land Use Planning</h4>
          </div>
        </a>
      </div>
    </div>
    <div class="col-md-4">
      <div class="thumbnail">
        <a href="https://pawalter.psu.edu/topics/water-quality">
          <img src="<?php $theme_path = drupal_get_path('theme', variable_get('theme_default',NULL));
          print $theme_path;
          ?>/images/Water-Quality.jpg" alt="Water Quality" >
          <div class="caption">
            <h4>Water Quality</h4>
          </div>
        </a>
      </div>
    </div>
  </div>
</div>

引导容器在网格中的高度不同

0 个答案: