javascript - <div> 的大小应始终保持不变

Question

所以我有这段代码来显示一张卡片(面板)，该卡片(面板)由一张带有下面链接的图片组成。现在 div 的高度随着每个图像的变化而变化，因为图像大小不同。 我希望无论图像大小如何，div 始终具有相同的高度。

可能这只是一个 css 更改。有什么想法吗？

<div class ="row" style="margin-top: 40px;">
  <h3 style="text-align: center; color:#000;">Top Walls near you</h3><br/>
  <% @walls.each do |wall| %>
  <div class ="col-md-4">
    <div class="panel panel-default">
    <div class ="panel-heading preview">
      <%= link_to wall do %>
      <%= image_tag wall.cover_photo(:medium) %>
      <% end %>

    </div>
    <div class="panel-body" style="box-shadow: 2px 27px 25px -19px rgba(176,176,176,1);">
      <%= link_to wall.address, wall %>
    </div>
  </div>
</div>
 <% end %>
</div>

Answer 1

你好只需为具有“width”属性的 div 元素设置一个默认值:

<div width = "1000px"></div>

或

CSS:

 div {width:1000px;}

您可以在具有默认大小的 div 中添加您正在使用的图像标签或 div 标签，并通过 overflow 属性控制外观宽度。示例:

CSS: 溢出:隐藏；