<分区>
编辑问题以包含 desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem .这将有助于其他人回答问题。
关闭 7 年前。
标签 html css css-position
<分区>
编辑问题以包含 desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem .这将有助于其他人回答问题。
关闭 7 年前。
我有一个没有固定宽度的 div(这个 div 应该有内容的宽度)里面有一个带有 position:absolute 和固定宽度的 div，但是相对的 div 有0px 宽度，我该如何解决？
<div class="container" style="position:relative">
<div class="innerContainer" style="position: absolute; width: 30px; height: 10px"></div>
</div>最佳答案
绝对定位的 div 从正常流中取出，因此在本例中不会影响其父级高度。父级将显示为没有内容(高度为 0 像素)。
在您的情况下，您需要为您的父级(容器)提供足够大的高度，以使绝对位置内容适合或填充正常的流动内容，并将内部 div 定位在左侧和底部，如下所示。
.container {
position:relative;
min-height: 50px;
background: gray;
padding-left: 40px;
}
.innerContainer {
position:absolute;
left: 0;
top: 0;
width: 30px;
height: 10px;
background: darkgray;
}
.innerContainer:nth-child(2) {
top: auto;
bottom: 0;
background: lightgray;
}<div class="container">
<div class="innerContainer"></div>
<div class="innerContainer"></div>
</div>
<br>
<div class="container">
<div class="innerContainer"></div>
<div class="innerContainer"></div>
This has text that sizes itself<br>
This has text that sizes itself<br>
This has text that sizes itself<br>
</div>关于html - 位置为 :absolute content 的 div 的宽度，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35985288/