我正在为客户开发移动网站，我的幻灯片放映方法有问题，如下所示:
100%宽度的包装容器，overflow:hidden，position:relative
此容器内的一个 ul，宽度为 (#children*100)%，position:relative
宽度为 (100/#li)% 的可变数量的 lis，向左浮动，每个包含宽度为:100% 的图像
对于每次迭代，ul 的“left”属性递减 100%
此方法在桌面浏览器和移动 safari 上效果很好，但 android 浏览器对 float 百分比的处理不佳，无法正确呈现它们。我无法确定但似乎当我将 100/6 = 16.66666667% 的宽度应用于 li 时它被呈现为 16%，即使当我通过 javascript 查询该元素的宽度时它返回正常的 chop 16.6667% 宽度。结果是，随着幻灯片放映的每次迭代，图像变得越来越偏左，因为它们没有占据包装容器中正确的空间量。
有趣的是，当我将元素的数量减少到能整除 100 的数字时，比如 100/5 = 20%，这个问题就完全消失了。
我查看了之前有关像素舍入的主题，但我认为这不是问题所在。据我所知，像素舍入发生在像素计算有余数并且浏览器必须将结果舍入到最接近的像素时，这似乎是浏览器不理解小数百分比是什么的问题。
有没有其他人遇到过这样的问题？
最佳答案
许多浏览器不能正确处理百分比的分数:
http://www.sitepoint.com/forums/showthread.php?547308-CSS-percentage-width-roundoff
关于javascript - Android vs Iphone vs Safari/Chrome/FF 上的像素舍入，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12428401/