RESOLVED MOVED 126151
Mobile Safari for iOS 7 (iPad 4) does not render multiple box shadows in some cases 
https://bugs.webkit.org/show_bug.cgi?id=126151
Summary Mobile Safari for iOS 7 (iPad 4) does not render multiple box shadows in some...
Behrang Saeedzadeh
Reported 2013-12-23 00:24:32 PST
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>
Attachments
Rendering in Safari 7 under OS X Mavericks (117.30 KB, image/png)
2013-12-23 00:24 PST, Behrang Saeedzadeh 		no flags
Details
Rendering in Mobile Safari, iOS 7.0.4, iPhone 5 (36.35 KB, image/png)
2013-12-23 00:27 PST, Behrang Saeedzadeh 		no flags
Details
Rendering in Mobile Safari, iOS 7, iPad 4 (111.48 KB, image/png)
2013-12-23 00:28 PST, Behrang Saeedzadeh 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Behrang Saeedzadeh
Comment 1 2013-12-23 00:27:18 PST
Created attachment 219897 [details] Rendering in Mobile Safari, iOS 7.0.4, iPhone 5
Behrang Saeedzadeh
Comment 2 2013-12-23 00:28:02 PST
Created attachment 219898 [details] Rendering in Mobile Safari, iOS 7, iPad 4 Please notice that the borders are not being rendered at all.
Behrang Saeedzadeh
Comment 3 2013-12-23 00:28:54 PST
I might have specified the wrong version for WebKit. This issue happens under the iOS 7 + Mobile Safari + iPad 4 combo.
Behrang Saeedzadeh
Comment 4 2013-12-23 15:09:15 PST
A video demonstration of the problem: http://www.youtube.com/watch?v=eTewrM5vIaQ
Behrang Saeedzadeh
Comment 5 2013-12-23 15:24:57 PST
Another video: http://www.youtube.com/watch?v=cBBAlkQZ8wo&feature=youtu.be
Radar WebKit Bug Importer
Comment 6 2014-01-02 12:17:41 PST
<rdar://problem/15739693>
Radar WebKit Bug Importer
Comment 7 2014-01-02 12:17:42 PST
<rdar://problem/15739694>
Brent Fulgham
Comment 8 2022-02-10 14:23:31 PST
This was actually: <rdar://13569323>
Brent Fulgham
Comment 9 2022-02-10 14:23:52 PST
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.
Note You need to log in before you can comment on or make changes to this bug.