Css Chrome和Opera在使用浮动时失败

我在指定元素的尺寸时使用浮动。请看这个JSFIDLE，但是Chrome和Opera都没有设置正确的宽度，因此两个div之间有一个像素间隙，正如您在see图像中看到的，Chrome和Opera不能正确处理浮动吗？为什么会有一个像素间隙？

之所以会出现这种情况，是因为您将宽度指定为

466.5px

，这是其他浏览器（例如firefox）对

467px

的取整。chrome试图正确渲染，因此有一条以红/黄组合显示的单像素线（这会混淆浏览器，看起来像但不是间隙）

为了避免这种情况，请不要使用半像素来指定尺寸（您认为示例应该是什么样子的？chrome完全符合我的预期，但我不知道您打算使用半像素）

看看我将外部div的宽度调整为

932px

，将内部div的宽度调整为

466px

——在chrome上非常有效

编辑：

---

如果您需要宽度为

933px

，另一个可以让所有浏览器显示相同的解决方案是在您自己的浏览器中设置一个应该存在的间隙：

发生这种情况是因为您将宽度指定为

466.5px

，这是其他浏览器（例如firefox）对

467px

的舍入。chrome试图正确渲染，因此有一条以红/黄组合显示的单像素线（这会混淆浏览器，看起来像但不是间隙）

为了避免这种情况，请不要使用半像素来指定尺寸（您认为示例应该是什么样子的？chrome完全符合我的预期，但我不知道您打算使用半像素）

看看我将外部div的宽度调整为

932px

，将内部div的宽度调整为

466px

——在chrome上非常有效

编辑：

---

如果您需要宽度为

933px

的浏览器，另一个可以使所有浏览器显示相同的解决方案是在您自己的屏幕上设置一个空白：

这是您的问题：

宽度：466.5px小数点不是普遍支持的。一些信息和可能的解决方案：
这是您的问题：
宽度：466.5px小数点不是普遍支持的。一些信息和可能的解决方案：
如上所述，问题在于半像素。显示器的工作原理和像素是一块无法对半的光。某些浏览器可能会尝试并巧妙地解决此问题，但在执行此操作时，您无法在所有浏览器中获得一致的结果

我建议您使用960像素的宽度，并使用类似

没有办法让它工作，因为它不是有效的CSS。
如上所述，问题在于半像素。显示器的工作原理和像素是一块无法对半的光。某些浏览器可能会尝试并巧妙地解决此问题，但在执行此操作时，您无法在所有浏览器中获得一致的结果

我建议您使用960像素的宽度，并使用类似

你无法让它工作，因为它是无效的CSS。
好吧，933（父宽度）/2（子项数量）=466.5，这就是原因。但我仍然不明白为什么会有所谓的差距。示例如下：一个子项占50%，另一个占50%，考虑到，应该没有间隙。因为有一条半黄半红的
1px
行无法通过浏览器显示（也许这条线应该是橙色而不是白色，但你不会（也不应该）得到锐利的边缘），不幸的是，这不是那么容易，所以
932px
对我来说不是一个解决方案。好吧，933（父宽度）/2（孩子的数量）=466.5，这就是原因。但我仍然不明白为什么会有所谓的差距。示例如下：一个孩子占50%，另一个占50%，考虑到，应该没有间隙。因为有一条半黄半红的
1px
行无法通过浏览器显示（也许这条线应该是橙色而不是白色，但你不会（也不应该）得到锐利的边缘），不幸的是，这不是那么容易，所以
932px
对我来说不是一个解决方案。