如何去除流体网格中第 12 列右侧的 1px 空白/坏点

Question

当 8 列浮动在 4 列旁边以形成容器的完整 12 列时，右侧有一个小的坏点，它会随着浏览器的缩放而反复出现。这似乎是由于四舍五入和小数位问题。

它所在的网格是由不同的前端开发人员创建的自定义流体网格。当您拖动 window 时，它会出现和消失。偶尔有，有时没有。

我研究过更改此网格的百分比，但根本无法解决此问题。有什么想法吗？

这是一个由工具为我生成的自定义网格的示例。使用这些数字并不能解决 1px 问题。

Span 1:    8.33333333333%
Span 2:    16.6666666667%
Span 3:    25.0%
Span 4:    33.3333333333%
Span 5:    41.6666666667%
Span 6:    50.0%
Span 7:    58.3333333333%
Span 8:    66.6666666667%
Span 9:    75.0%
Span 10:    83.3333333333%
Span 11:    91.6666666667%
Span 12:    100%

Answer 1

jeromeM 的回答是正确的。我从 Foundation 中提取了这个：

[class*="column"] + [class*="column"]:last-child {
  float: right;
}

最后一列应始终向右浮动以解决此问题。 1 个像素将由最后一列向右浮动处理。

如何去除流体网格中第 12 列右侧的 1px 空白/坏点

How to remove 1px blank / dead pixel on the right side of the 12th column in a fluid grid

html

css

fluid-layout

responsive-design