css学习之---浮动父级塌陷的解决办法

问题描述：

代码结构：

<div class="newslist">
    <div class="list">
  		<ul>
  			<li></li>
  			<li></li>
  			<li></li>
  		</ul>
  	</div>
  	<div class="page"></div>
</div>

 li 增加float:left 样式后，div .page 位置上移；

解决方案：

通过after伪类实现解决父级边框塌陷

.list ul:after{
    content: '';
    display: block;
    clear: both;
}