5.bootstrap栅格 清除浮动

只要用到栅格，就注意要清除浮动，清除方法就是在父元素的class上加一个clearfix

1.情景:

.

<div class="col-sm-7">
                <div class="news-list">
                    <div class="news-list-item ">
                        <div class="col-xs-5">
                            <img src="img/002.jpg">
                        </div>
                        <div class="col-xs-7">
                            <a href="#" class="title">2年前他为教育事业和高圆圆分手，今成这般，高圆圆：我有一句MMP如鲠在喉</a>
                            <div class="info">
                                <span><span class="avatar"><img src="img/logo.jpg"></span>王花花</span>⋅
                                <span>25k评论</span>⋅
                                <span>10分钟前</span>
                            </div>
                        </div>
                    </div>

                    <div class="news-list-item">
                        <div class="col-xs-5">
                            <img src="img/003.jpg">
                        </div>
                        <div class="col-xs-7">
                            <a href="#" class="title">2年前他为教育事业和高圆圆分手，今成这般，高圆圆：我有一句MMP如鲠在喉</a>
                            <div class="info">
                                <span><span class="avatar"><img src="img/logo.jpg"></span>王花花</span>⋅
                                <span>25k评论</span>⋅
                                <span>10分钟前</span>
                            </div>
                        </div>
                    </div>

出现这样的原因：主要是没有清除浮动

解决办法：

只需在父类上添加clearfix就可以了

即：<div class="news-list-item clearfix">

结果：