问题描述
晚上帮舍友看了bootstrap里的问题，当屏幕比较大的时候，一切正常，但当屏幕缩小到一定的程度时候，使用栅格完成的部分覆盖了栅格前面的div
矛盾点
bootstrap本来具有很好的响应式，为什么在大屏的时候一切ok,但小屏会出问题。
问题解决
Q1:开始时觉得舍友的栅格没有使用正确
A1:查看官网bootstrap的栅格使用后，发现是没有问题的，开始在浏览器上一点点的调试，定位到问题是pull-left，当宽度小于768px的后，问题就出现了.
Q2:pull-left 在小屏的时候属性会做出哪些改变？
A2: google搜索，在stackOverflow上发现，标准的bootstrap的 pull-classes在手机端上会失效，源码如下：
@media(max-width:769px) {
.pull-right {
float:right!important;
}
.pull-left {
float:left!important;
}
}
解决办法：手机端的时候需要手动的写CSS样式
反思
这是booystrap不好的一点设计吧，以前还没遇见过如此奇葩的问题，这个坑得记住，经验积累吧。
