html - iPad 上的方向更改不会重绘 CSS 框阴影

Question

在 iPad 上查看页面时，我在绘制框阴影时遇到了一个奇怪的错误。在纵向模式下，阴影会按应有的方式呈现，但当设备改变方向或以横向模式访问页面时，阴影就会消失。这不会发生在 iPhone 或桌面浏览器上。

我正在使用基本的框阴影，例如: box-shadow: 0px 23px 26px -13px rgba(0,0,0,0.71);

是否有某些特定原因导致它不能仅在 iPad 上以特定方向绘制？

我在这里制作了一个简单的 jsFiddle:http://jsfiddle.net/3sPjw/

Answer 1

这是一个已确认的错误。我正在使用装有 IOS 7.0.4 的 iPad air，它出现了这种行为。即使在纵向模式下，如果您放大任意数量，阴影也会消失。

解决方法是在要添加阴影的元素上设置边框半径。添加一个像素的边界半径足以解决此缺陷。