对子像素计算进行safari舍入 [英] safari rounding down on subpixel calculations

问题描述

我有一个容器，在一行上占用829px，并且具有相同大小的背景图像。

i have a container that takes up 829px on a row, and has a background-image of the same size.

我有一个div在该容器中计算其宽度基于829px容器。
on safari，divs宽度出来是像173.8像素，但从safari / webkit向下舍入，它的截断，并变成173px的宽度。

i have a div within that container that calculates its width based on the 829px container. on safari, the divs width comes out to be something like 173.8px, but since safari/webkit round down, its truncated and becomes 173px in width.

这个829px容器在同一行上有3个div。第一个div，1px丢失，第二个，2px丢失，第三个，3个像素丢失，所以第三个div向左移动三个像素。在ipad上，这6个像素丢失。

this 829px container has 3 divs inline on the same row. the first div, 1px is lost, the second, 2px is lost, and by the third, 3 pixels are lost, so the third div is shifted left by three pixels. on an ipad, thats 6 pixels lost.

我试图搜索子像素渲染问题，ive阅读john resigs文章和一些其他的SO问题，但我无法找到一个办法。

i've tried to search for subpixel rendering problems, and ive read john resigs article and some other SO questions but i couldnt find a solution.

在google上，我发现了一篇文章： http://www.pixafy.com/blog/2013/05/css-subpixel-rendering/#more-310
i尝试将其应用于我的情况，但我

on google, i found an article: http://www.pixafy.com/blog/2013/05/css-subpixel-rendering/#more-310 i tried to apply it to my situation, but i cannot get away with not setting a width thats calculated on the containers 829px.

我可以做什么？

推荐答案

不幸的是，你可以做很多不同的浏览器渲染子像素。

There isn't a whole lot you can do about how different browsers render subpixels, sadly. It'd be great if we could choose how the rounding should be handled through CSS, but nope.

只需使用像素而不是百分比就可以解决这个问题，但显然不是你要什么。如果你通过媒体查询改变值（可能是一个百分比值），我想你可以得到静态像素。

Simply using pixels rather then percentages would solve the problem but that's obviously not what you want. I guess you could get around with static pixels if you change the values (possible to a percentage value) through media queries.

每当我发现自己在类似的情况下， code> float 右边的最后一个子项。最后一个和最后一个元素之间的几个附加像素通常不会像最后一个元素和其父元素之间的几个额外像素那样受到伤害。

Whenever I find myself in a similar scenario I float the last child to the right. A few additional pixels between the last and second last elements don't usually hurt as much as a few additional pixels between the last element and its parent.

这篇关于对子像素计算进行safari舍入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！