Question

正如您在jsFiddle中看到的那样，＆＃39; innerFooter＆＃39; div正在扩展到它的父母＆＃39;页脚＆＃39;尽管它的显示：内联块样式。我试过显示：table，works，只是想知道内联块是不是。谢谢！

的 HTML 的

<div id="footer">
        <div id="innerFooter" class="clearfix alignCenter">
            <ul id="resources">
                <li><a href="#"><b><u>Useful links</u></b></a></li>         
                <li><a href="#">About us</a></li>
                <li><a href="#">Privacy</a></li>
                <li><a href="#">Blog</a></li>
            </ul>
            <ul id="social">
                <li><a href="#"><b><u>Get social</u></b></a></li>           
                <li><a href="#">Twitter</a></li>
                <li><a href="#">Facebook</a></li>
                <li><a href="#">Pinrest</a></li>
            </ul>
            <ul id="contact">
                <li><a href="#"><b><u>Contact us</u></b></a></li>           
                <li><a href="mailto:emailaddress>Email us</a></li>
            </ul>               
        </div>
</div>

的 CSS 的

clearfix{/*Clearfix hack here*/} 
alignCenter{margin: 0 auto}
a{color: inherit}
#footer{
    color: #fff;    
    background-color: #000; 
}
#innerFooter{
    display: inline-block
}
#footer ul{
    width: 200px;
    display: inline-block;
    margin: 0 auto;
    float: left;
}
#footer ul > li{
    margin: 5px;
    list-style-type: none;
}

Answer 1

内部页脚已在其中浮动元素，因此其宽度为所有浮动元素的摘要（“ul”）。

内联块div将其宽度扩展到父div，为什么？

1 个答案: