iPad上的方向更改不會重新繪製CSS框陰影

Question

當在iPad上查看頁面時繪製框陰影時，我遇到了一個奇怪的錯誤。在縱向方向上，陰影呈現爲應有的形狀，但當設備改變方向或在橫向模式下訪問頁面時，陰影消失。這在iPhone或桌面瀏覽器上不會發生。

我使用的一個基本的box-shadow，如： 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空氣，並顯示出這種行爲。即使在肖像模式下，如果您放大任何數量的影子，陰影也會消失。

解決的辦法是在要添加陰影的元素上設置邊框半徑。添加一個像素邊界半徑足以解決此缺陷。一個奇怪的解決方案的

Answer 2

類，但它的工作（在IPAD測試），這要歸功於 Box-shadow not shown on Safari Mobile on iOS 7 (in landscape)

h1 { 
box-shadow: 0 4px 9px -8px #000000; 
border-radius: 1px; 
color: #D95B43; 
height: 1.2em; 
margin-top: 0; 
font-size: 1.3em; 
padding: 10px; 
}