我正在使用最近下载的 Bootstrap 为我的网站创 build 计
我尝试使用 row
和 span12
布局容器 div 没有居中于我的屏幕。我使用的是 58cm LED 显示器(它看起来不居中)。
DIV 宽度显示 1170px(Firebug),它应该是 940px。
请在这里查看我的设计http://rentbbsr.com/projects/daycare/
应该是这样的http://rentbbsr.com/projects/daycare/daycare.jpeg
我只希望标题固定并居中。
最佳答案
有很多原因。该行的左边距为负数:
@media (min-width: 1200px)
.row {
margin-left: -30px;
}
}
.row {
margin-left: -20px;
}
然后你在跨度上还有另一个边距:
@media (min-width: 1200px)
[class*="span"] {
float: left;
min-height: 1px;
margin-left: 30px;
}
class*="span"] {
float: left;
min-height: 1px;
margin-left: 20px;
}
然后您居中的容器比内容宽。由于它更宽,它使该元素居中,但它有一个空白区域。如果您将它设置为您想要居中的任何内容的宽度,例如树形图形或下面的菜单,它实际上会居中。
在这种情况下,我将其设置为顶部图形的宽度:
.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container {
width: 988px;
}
记得在媒体查询中也设置它。
所以总而言之,你的包装元素比内容更宽,而且你到处都有各种边距,这进一步调整了宽度。如果您删除它们并设置正确的宽度,它将按预期居中。
关于css - 新的 Bootstrap 布局不居中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16598679/