我在上一篇文章中提出了一个回应性问题。
How to set responsive divs in my case?
我将我的html修改为有效的HTML代码,但似乎我在平板电脑视图中不再有红色列左侧和灰色列右侧的填充。我想我确实有有效的bootstrap类,但我不确定会发生什么。有人可以帮我解决这个问题吗?
我的jsFiddle
http://jsfiddle.net/0qarh5yt/6/
<div class="container">
<div id="wrapper">
<div class="row">
<div class="col-md-1"></div>
<div class="col-xs-12 col-md-2">
<div class="row">
<div class="col-xs-3 col-md-12 box1">
test
</div>
<div class="col-xs-9 col-md-12 box2">
test 2
</div>
</div>
</div>
<div class="col-xs-12 col-md-2">
<div class="row">
<div class="col-xs-3 col-md-12 box1">
test
</div>
<div class="col-xs-9 col-md-12 box2">
test 2
</div>
</div>
</div>
<div class="col-xs-12 col-md-2">
<div class="row">
<div class="col-xs-3 col-md-12 box1">
test
</div>
<div class="col-xs-9 col-md-12 box2">
test 2
</div>
</div>
</div>
<div class="col-xs-12 col-md-2">
<div class="row">
<div class="col-xs-3 col-md-12 box1">
test
</div>
<div class="col-xs-9 col-md-12 box2">
test 2
</div>
</div>
</div>
<div class="col-xs-12 col-md-2">
<div class="row">
<div class="col-xs-3 col-md-12 box1">
test
</div>
<div class="col-xs-9 col-md-12 box2">
test 2
</div>
</div>
</div>
</div>
</div>
</div>
答案 0 :(得分:-1)
您在行上有负边距:
.row {
margin-right: -15px;
margin-left: -15px;
}
如果您删除这些或将它们设置为0,它将解决您的问题 (其他一切都还可以);
<强> fiddle 强>