Question

我有以下html标记：

            <div id="com_loaded">
                <div id="com_loaded_userpic"><a href="#" class="tooltip"><img src="pic.jpg" class="img_poster" /><span>Username</span></a></div>
                <div id="com_loaded_content">
                    <div id="com_loaded_poster">Username</a></div>
                    <div id="com_loaded_text">Comment text</div>
                </div> 
            </div>

以及以下css标记：

 #com_loaded {
position: relative;
width: 250px;
padding: 0px;
clear: both;
background-color:#3FC;
 }

 #com_loaded_userpic {
position: relative;
width: 55px;
height: 60px;
float: left;
padding-left: 5px;
 }

 #com_loaded_content {
position: relative;
width: 185px;
float: left;
padding-left: 5px;
 }

 #com_loaded_poster {
position: relative;
width: 185px;
float: left;
clear: left;    
 }

 #com_loaded_text {
position: relative;
width: 185px;
float: left;
clear: left;
padding-bottom: 10px;
 }

容器com_loaded具有背景色。但是这种背景颜色没有显示出来。当我给容器一个高度时，它显示出来。但由于comment_text没有一定的高度（这取决于评论的时间长度），我不想设置一个高度。

如何为容器中的所有div显示容器的背景颜色？我不知道我做错了什么......

Answer 1

浮动内容不会影响其容器的布局，因此除非您明确设置浮动内容，否则任何包裹在浮动div周围的项目都没有高度（或者除非有其他元素可以给它一个高度）。您可以通过在#com-loaded。

末尾添加<div style="clear:both;"></div>来更正此问题

不能让div有背景色

1 个答案: