<分区>
<分区>
<div id="footer">
<div>
<h2>Revovation</h2>
<p>Our mission is to provide the best handyman service at an reasonable price without sacrificing quality. You will be satisfy with our work knowing we take the necessary steps to meet your needs and get the job done right
</p>
</div>
<div>
<h2>Information</h2>
<div>
<ul>
<li>Blog</li>
<li>Services</li>
<li>Extras</li>
<li>Contact</li>
</ul>
</div>
<div>
<ul>
<li>Projects</li>
<li>Information</li>
<li>About us</li>
<li>Shop</li>
</ul>
</div>
</div>
<div>
<h2>Renovation Office</h2>
<ul>
<li><img src="images/marker.png" alt="">Address</li>
<li>Phone</li>
<li>Email</li>
<li>Fax</li>
<li>Timings</li>
</ul>
</div>
</div>
编辑:添加CSS
#footer
{
background : #282828;
border: 2px solid blue;
font-family : verdana;
position: relative;
color : #8e9a8c;
}
#footer div
{
background : #282828; !important;
width : 28%;
border: 1px solid red;
float : left;
padding: 60px 0px 30px 40px;
}
蓝色边框用于页脚 div，红色边框用于其中的 div。我在 div 中向左浮动。为什么外部 div 不覆盖所有三个内部子 div？我不知道这里出了什么问题!
最佳答案
这看起来像是元素的 float 子元素折叠父元素高度的主要情况:https://css-tricks.com/snippets/css/clear-fix/
.clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
* html .clearfix { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
只需将 clearfix 类添加到高度已折叠的元素，在这种情况下:
<div id="footer" class="clearfix">
关于html - div 内的 div 无法正常工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35032423/