Created attachment 219896 [details] Rendering in Safari 7 under OS X Mavericks In Safari for iOS 7 (iPad 4), the following HTML/CSS (JSBin here: http://jsbin.com/ohErOtuM/1) does not render any borders around the .coming-soon div. I have attached three screenshots that show how it is rendered in Safari 7 for OS X, Safari 7 for iOS 7 (iPad 4), and Safari 7 for iOS 7 (iPhone). <!DOCTYPE html> <html> <head> <title>Title</title> <style type="text/css"> body { text-align: center; margin-top: 100px; } .coming-back { display: inline-block; padding: 100px; background-color: rgb(31, 219, 153); -webkit-box-shadow: 15px 15px 0 0 #2d9a74, 14px 14px 0 0 #2d9a74, 13px 13px 0 0 #2d9a74, 12px 12px 0 0 #2d9a74, 11px 11px 0 0 #2d9a74, 10px 10px 0 0 #2d9a74, 9px 9px 0 0 #2d9a74, 8px 8px 0 0 #2d9a74, 7px 7px 0 0 #2d9a74, 6px 6px 0 0 #2d9a74, 5px 5px 0 0 #2d9a74, 4px 4px 0 0 #2d9a74, 3px 3px 0 0 #2d9a74, 2px 2px 0 0 #2d9a74, 1px 1px 0 0 #2d9a74; -moz-box-shadow: 15px 15px 0 0 #2d9a74, 14px 14px 0 0 #2d9a74, 13px 13px 0 0 #2d9a74, 12px 12px 0 0 #2d9a74, 11px 11px 0 0 #2d9a74, 10px 10px 0 0 #2d9a74, 9px 9px 0 0 #2d9a74, 8px 8px 0 0 #2d9a74, 7px 7px 0 0 #2d9a74, 6px 6px 0 0 #2d9a74, 5px 5px 0 0 #2d9a74, 4px 4px 0 0 #2d9a74, 3px 3px 0 0 #2d9a74, 2px 2px 0 0 #2d9a74, 1px 1px 0 0 #2d9a74; box-shadow: 15px 15px 0 0 #2d9a74, 14px 14px 0 0 #2d9a74, 13px 13px 0 0 #2d9a74, 12px 12px 0 0 #2d9a74, 11px 11px 0 0 #2d9a74, 10px 10px 0 0 #2d9a74, 9px 9px 0 0 #2d9a74, 8px 8px 0 0 #2d9a74, 7px 7px 0 0 #2d9a74, 6px 6px 0 0 #2d9a74, 5px 5px 0 0 #2d9a74, 4px 4px 0 0 #2d9a74, 3px 3px 0 0 #2d9a74, 2px 2px 0 0 #2d9a74, 1px 1px 0 0 #2d9a74; color: #fff; font-family: "rooney-sans",sans-serif; font-style: italic; font-size: 96px; } @media screen and (min-width: 768px) and (max-width: 1024px) { body { margin-top: 50px; } .coming-back { padding: 50px; font-size: 64px; } } @media screen and (max-width: 767px) { body { margin-top: 50px; } .coming-back { padding: 50px; font-size: 64px; } } </style> </head> <body> <div class="coming-back"> Coming back soon! </div> </body> </html>
Created attachment 219897 [details] Rendering in Mobile Safari, iOS 7.0.4, iPhone 5
Created attachment 219898 [details] Rendering in Mobile Safari, iOS 7, iPad 4 Please notice that the borders are not being rendered at all.
I might have specified the wrong version for WebKit. This issue happens under the iOS 7 + Mobile Safari + iPad 4 combo.
A video demonstration of the problem: http://www.youtube.com/watch?v=eTewrM5vIaQ
Another video: http://www.youtube.com/watch?v=cBBAlkQZ8wo&feature=youtu.be
<rdar://problem/15739693>
<rdar://problem/15739694>
This was actually: <rdar://13569323>
The fix for this issue was needed outside the WebKit project, therefore this is being resolved as 'Moved'. This should now be fixed in shipping software.