在浏览器中放大后div选择器之间的奇怪空格

Question

当我在Chrome或Firefox中放大页面时，div选择器之间会出现奇怪的差距：

当缩放级别为100％时，一切都很好。

如何解决这个问题？

Answer 1

这些是来自舍入或边缘平滑的工件，并且在某些程度上在所有浏览器中都有出现。

例如，如果您有一个5像素宽的元素，并以1.5缩放级别显示，那么它应该是7.5像素宽。由于您无法在屏幕上绘制半像素，因此它可以舍入为偶数，也可以使用平滑绘制，即八个像素以50％不透明度绘制。

为了避免这些瑕疵，你必须使这些元素重叠，这样当元素无法准确显示它们应该存在的位置时，还有一些额外的余地。

Answer 2

我解决了这个-1px边距的问题。

Answer 3

是的，-1px margin属性应解决此问题，但请注意，您不会通过带有负值的CSS验证程序。

Answer 4

为避免这种情况，请始终使用

  

风格= “宽度：100％”

你的div选择器上的