【发布时间】：2014-03-30 01:03:07
【问题描述】：
如果您查看页面：Boostrap Docs，在网格选项标题下，有一个表格列出了新网格的功能。
我做了一个有 12 列的小页面（使用 .col-lg- 类）。
在表格中，它说“Max column with”是 95px（表格中的第 4 行）。但是，当我检查一列时，计算出的值为 97.5px，而不是 95px。
当我在 Photoshop 中测量列长度时，它们在 98 像素和 97 像素之间交替（可能是由于将 77.5 像素四舍五入）。
非常感谢你们能解释一下这种差异是如何产生的？或者，当他们提到“最大列宽”时，引导文档是否引用了其他内容？
（我不擅长 CSS 和网格系统，如果我有什么问题请见谅）。
这是我整理的测试代码：
<!DOCTYPE html>
<head>
<title>Test</title>
<link type="text/css" rel="stylesheet" href="css/bootstrap.css" />
<style>
p {
background-color: #999
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-xs-1"><p> </p></div>
<div class="col-xs-1"><p> </p></div>
<div class="col-xs-1"><p> </p></div>
<div class="col-xs-1"><p> </p></div>
<div class="col-xs-1"><p> </p></div>
<div class="col-xs-1"><p> </p></div>
<div class="col-xs-1"><p> </p></div>
<div class="col-xs-1"><p> </p></div>
<div class="col-xs-1"><p> </p></div>
<div class="col-xs-1"><p> </p></div>
<div class="col-xs-1"><p> </p></div>
<div class="col-xs-1"><p> </p></div>
</div>
</div>
<script src="js/bootstrap.js" >
</body>
</html>
谢谢。
【问题讨论】：
-
目前在 Firefox 和 Chrome 中。几乎相同的行为。认为浏览器或引导程序没有任何问题 - 也许我没有正确理解“最大列宽”的概念。谢谢。
标签： html css twitter-bootstrap