0

我有以下 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 显示容器的背景颜色？我不知道我做错了什么......

4

1 回答 1

3

浮动内容不会影响其容器的布局，因此围绕浮动 div 的任何项目都将没有高度，除非您明确设置它（或者除非有其他元素可以赋予它高度）。<div style="clear:both;"></div>您可以通过在#com-loaded 末尾添加一个来纠正此问题。

于 2012-09-16T08:08:47.233 回答