Responsive design 网格的亚像素渲染问题

我遇到了一个流体网格的wierd问题。在chrome和firefox中，一切看起来都不错，但在Ios和桌面safari上，网格不会对齐。我意识到这是因为浏览器呈现子像素的方式不同。我的问题是，是否有人对此有解决办法

请参见此处的工作示例：