Question

div怎么样自动适应div的大小

平常div会自动适应div里面内容的大小，但是不会适应div的大小，比如说：
<div id="1" style="border-bottom:1px solid #EEE;">
<img src="" height="60px"/>
<div id="2">
(这里有很多行文字，height超过60px)
</div>
</div>
这样子 最外层的div高只有60px，我希望是img比div2高的话div1的高是60px，而文字比img高的话外层div适应文字的高
不好意思，我搞错了img还要有个div float:left就是
<div style="border-bottom:1px solid #EEE;">
<div style="float:left;">
<img src="" height="60px"/>
</div>
<div>
(这里有很多行文字，height超过60px)
</div>
</div>

Answer 1

这个是float的一个bug，解决方法：
<div style="border-bottom:1px solid #E00;">
<div style="float:left;">
<img src="" height="60px"/>
</div>
<div>
(这里有很多行文字，height超过60px)
</div>
<div style="clear:both;"></div>
</div>

在最外层div标签结尾之前加一个空白的div 然后clear：both，就可以实现最外层div高度自适应了。这个没什么原因好解释的，就是个浏览器bug而已。

Answer 2

<div id="1" style="border-bottom:1px solid #EEE; overflow:hidden;">
<img src="images/1.jpg" height="60px" style="border:1x solid #dbdbdb;"/>
<div id="2">
<p>无标题文档</p>
<p>无标题文档</p>
<p>无标题文档</p>
<p>无标题文档</p>
<p>无标题文档</p>
<p>无标题文档</p>
<p>无标题文档</p>
<p>无标题文档</p>
<p>无标题文档</p>
</div>
</div>

Answer 3

最外层的高度你可以这样设：
min-height:60px; _height:60px;

追问

不好意思，我搞错了img还要有个div float:left就是

(这里有很多行文字，height超过60px)

我加我你这句没有用

追答

(这里有很多行文字，height超过60px)

在这个后面加：

追问

给个图你看一下，我想要的效果红色的线在文字下面，之前的代码没写好，是我的错，我想搞一个类似QQ空间那样的，这回说得很清楚了，应该可以了吧，之前我没加min-height:60px; _height:60px; 这句红色的线在最上面 加上之后才显示到图片下面的，我文字不固定行，可能比图片高，也可能比图片矮，反正哪个高在哪个下面

追答

不要用定位 你可以在文字层上加样式：padding-left:70px 来达到你想要的效果~