li里的a标签浮动了,为什么li本身也浮动了?

<ul>  
    <li><a href="#"></a></li>  
    <li><a href="#"></a></li>  
    <li><a href="#"></a></li>  
</ul>


ul {  
    list-style: none;  
}  

a {  
    display: block;  
     130px;  
    height: 30px;  
    text-align: center;  
    color: #fff;  
    float: left;  
    background: #95CFEF;  
    border: solid 1px #36F;  
    margin: 30px 5px;  
}

要实现想要的效果 需要闭合浮动 li{overflow:hidden}
这是浮动的一个bug:非浮动元素包裹浮动元素 非浮动元素的height:auto失效 不能根据内容自动适应高度 相当于height:0px

原文地址:https://www.cnblogs.com/zhujiabin/p/5010411.html