在Bootstrap中使一个div的高度与宽度相同

Question

6

我试图让一个div的高度与bootstrap中的col-md-3宽度相同，以便在页面调整大小时保持“正方形”。在bootstrap之外，我使用vw，但这里并非如此，并且高度为100％不起作用。有任何想法吗？需要简单和动态。

- jonwa

<div class="col-md-3"></div>这个元素的高度需要始终与宽度相等（宽度由boostrap col md 3设置），以便在所有屏幕尺寸上都能动态地适配。 - Pinpaho

2个回答

1

从我看到的来看，这个问题之前已经有答案了。

div {
  background:orange;
  width:?%;
  padding-top:?%;
}

width = padding=top

看这里

- Vlad Pana

请在问题中作为评论链接到先前回答的问题。 - ashawley

1

提供的链接不存在。 - manneJan89

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- J. Shabu · Accepted Answer

Bootstrap可以将高度设置成与宽度相同。列的宽度加上填充值，这样你就可以得到一个正方形的盒子。

.col-md-3{width:25%; padding:25%;}