我使用bootstrap 2.2.2,并有以下html标记。
<div class="container">
<h1>Responsive boxes</h1>
<div class="row-fluid">
<div class="span3">
<h3>M. 1</h3>
</div>
<div class="span3">
<h3>M. 2</h3>
</div>
<div class="span3">
<h3>M. 3</h3>
</div>
<div class="span3">
<h3>M. 4</h3>
</div>
</div>
</div> <!-- /container -->和css标记如下:
body {
background-color: #fff;
font-family: 'Cabin', Helvetica, Arial, sans-serif;
width: 100%;
text-align: center;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Lobster', Georgia, Times, serif;
}
h3{
color: #fff;
font-size: 139px;
line-height: 171px;
}
.span3 {
background: rgb(255, 81, 10);
height: 200px;
overflow: hidden;
margin-bottom: 30px;
}这个标记在桌面上运行良好,当我调整视窗(例如iphone)的大小时,框变得像预期的一样小,但是右边距被删除了。只有左边的空白处。我希望左右边距对齐。
如何解决这个问题?
发布于 2013-01-27 21:37:02
这就是你要找的吗?
http://jsfiddle.net/panchroma/BkNSL/
我注释掉了你身体css中的宽度
body {
background-color: #fff;
font-family: 'Cabin', Helvetica, Arial, sans-serif;
/* width: 100%;*/
text-align: center;
}https://stackoverflow.com/questions/14546546
复制相似问题