我用的是“容器流体”,对于使用“span2”等的列的水平宽度设置效果很好。
我有一个独特的要求,我代表的东西,我想显示“正方形”,同时仍然享受的好处,引导的响应宽度设置。有没有一个好的方法来确保我的元素有相同的高度和宽度?

最佳答案

您可以使用下面的填充技巧(请参见jsfiddle)使元素具有所需的任何纵横比(高度根据宽度调整):
外部div使垂直填充值为宽度百分比的正方形空间。
内部div使用外部div全尺寸(填充空间通常在外部不可用)。
HTML:

<div class="out">
  <div class="in">
  </div>
</div>

CSS:
.out {
  position: relative;
  height: 0;
  padding-bottom: 100%;
}
.in {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  background-color: red;
}

10-05 20:56
查看更多