我创建了一组四个 div 标签，background-color 为黄色，并指定了 width 和 height 然后我将其位置设置为 absolute 并将 bottom 设置为 0px ，如下面的代码所示:
#votingmeter {
width:25em;
height:20em;
background-color:black;
}
.voteindex {
width:2em;
height:8em;
background-color:yellow;
float:left;
position:absolute;
bottom:0;
margin:2em;
}<div id="votingmeter">
<div class="voteindex"></div>
<div class="voteindex"></div>
<div class="voteindex"></div>
<div class="voteindex"></div>
</div>(请参阅.votingindex)
但问题是 .votingindex 元素重叠。我希望在每个 div 元素之间应用一些空间。
谁能建议我一个方法吗？
此外，我希望黄色 div(.voteindex) 留在黑色 div (#votingmeter) 内。
最佳答案
用绝对位置将 .voteindex div 包裹在 div 中。
#votingmeter { width:25em;height:20em;background-color:black; position: relative; }
.voteindex { width:2em;height:8em;
background-color:yellow;float:left;
margin:2em;}
.bottom {
position:absolute;bottom:0;
}<body>
<div id="votingmeter">
<div class="bottom">
<div class="voteindex"></div>
<div class="voteindex"></div>
<div class="voteindex"></div>
<div class="voteindex"></div>
</div>
</div>
</body>关于html - 如何在绝对定位元素之间应用水平空间，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29713657/