Html 表宽100%关闭一个像素（取决于实际宽度）

我在一个

div

中有一个

table

，在另一个

div

中。direct容器的宽度为

40%

，通过设置

width:100%

，我希望表与这个div一样宽

相关标记

这在大多数情况下都有效，但是根据浏览器窗口的宽度，表格的宽度有时会被单个像素关闭：

从右边可以看到，边框是同级div

.info

左边的一个像素。这些边界应该对齐

相关CSS

---

对我来说似乎是一个渲染错误。它出现在Chrome 34.0.1847.131中，而不是IE10中。我无法在IE10或当前版本的FireFox中复制它。

我认为这与插入/开始边框有关-不同浏览器之间的边框不同。尝试将边框应用于父div而不是表。这应该能解决问题。

我在CHROME上也会遇到同样的错误

我检查了元素，我注意到的是，表框的宽度是217.443 px（显然是由于%widths）

在inspect元素HTML部分中，它将表的宽度定义为218px，包含的div定义为217px

当我稍微扩展broswer窗口，从而使表格宽度增加到217.443 px，达到217.680 px

HTML部分将表格宽度和包含的div显示为218 px

所以我猜浏览器正在将像素舍入到最接近的整像素

这是调查的正确途径吗

编辑：试试这个，看看是否适合你。我想我已经解决了这个问题

---

我只是删除了.table类上的宽度，并将其与

DISPLAY:block

重新关联。我遇到了同样的问题，并通过将宽度设置得稍微高一点来解决：

width: 100.12%

我试图使额外的百分比小到足以解决大多数情况，但不会造成1像素的溢出

---

这对我有用。不过这有点脏。

你能提供一个jsfiddle.net/link吗？我不能复制它@YosepKim在Chrome中查看JSFIDLE时，它显示了相同的行为。@MDeSchaepmeester它在我的MacBook的Chrome和window box的Chrome上看起来很好。这很奇怪…@YosepKim当时可能是另一个版本。我觉得奇怪的是，浏览器会将

100%

元素的宽度与它所在的容器分开计算。此外，对于my

.info

div和table.hmm，计算结果应该至少返回相同的数字。通过对这个亚像素渲染问题的研究，似乎没有快速解决方法。（有些人使用过Javascript）但至少你知道为什么现在会出现这个问题，并且可以找到解决/绕过它的方法。祝你好运。如果你的表元素有

表布局：固定？如果设置<代码>显示：块太多，表格大小不正确。插入/开始边框是什么意思？此外，如果我将边框应用于父div，则页面会断开，因为它旁边有一个div占用剩余的宽度（设置为60%）。您还可以使用
width:calc（100%+0.5px）
（或其他一些值），它可以以任何比例工作。我不知道浏览器的兼容性。@NotEnoughData这是一个快速修复，但我必须使用1px。使用0.5px仍然显示出差距。
width: 100.12%