使用基于百分比的布局时的奇怪数学

Question

我有两个主要div的布局。每个div的宽度为45％。然而，当我检查不同页面宽度的div时，div通常是一个彼此不同的像素。 639 vs 640.我真的不在乎这个问题，唯一的问题是较小的div内的物品与其他物品没有正确对齐。它只发生在某些页面宽度但是它被打破的次数超过了它的正确性。似乎较大div中的元素在任何窗口大小排列，较小的div几乎总是错误的，但在某些大小上是正确的。

这里发生了什么，有没有办法强迫较小的div像大的div那样行事？

Answer 1

宽度必须是整数。

955的45％是多少？ 429.75px。不能那样。因此，其中一个必须比另一个更宽。

Answer 2

这是一个错误/子像素问题。

I've asked a similar question a while back并发现基于webkit的浏览器在百分比方面存在舍入问题。

Here's the link该书架与我分享回答我的问题。

Answer 3

不要使用百分比，如果这样做，请确保总宽度增加到100％以下。使用100％时，我总是遇到溢出和错位问题。

我假设你有另一个占用剩余10％的div。所以，或许可以尝试44％。