Question

我的div内有另一个div。第二个div有width，height和background-color: green。这个具有绝对位置，所以它的容器没有显示。

<div id="root">

<div id="r1">

    <div id="r2">

    </div>
</div>
Mas
</div>

CSS文件

#root{
width:300px;
background-color: red;
}

#r1{

position: relative;
width: 100px;
background: yellow;

}

#r2{
position: absolute;
display: inline-block;
width: 50px;
height: 50px;
left: 0;
background-color: green;
}

http://jsfiddle.net/sev2E/1/

我想知道是否有可能显示其容器并将div包装在绝对位置。

我希望看到这样的东西，但不使用相对位置，也不增加容器的高度。

http://jsfiddle.net/sev2E/2/

谢谢！

Answer 1

为你的r1 css添加一些高度

#r1{

    position: relative;
    width: 100px;
    background: yellow;
    height:60px;

或添加填充底部：“你的div的高度”是相同的

#r1{

    position: relative;
    width: 100px;
    background: yellow;
    padding-bottom:55px

}

Answer 2

简短的回答是否定的。

一旦你绝对定位一个元素，就会从文档流中取出它，并且不再考虑计算其包含块的高度或宽度。

Android API（用Java编写）使用的文本格式化模型与CSS兼容的现代浏览器实现的不同。

要在基于CSS的网页和Android界面布局之间获得类似的视觉效果，您需要根据所使用的每种语言的规则和约束对每个实现进行编码。

Pumpkinpro的答案基本上是在CSS中获得“wrap_content”效果的方法。

绝对位置溢出

2 个答案: