RESOLVED WORKSFORME 147158
On iPhone 6+, border-radius doesn't seem to work with viewport meta.
https://bugs.webkit.org/show_bug.cgi?id=147158
Summary On iPhone 6+, border-radius doesn't seem to work with viewport meta.
narfity
Reported 2015-07-21 12:27:22 PDT
Created attachment 257191 [details] iphone 6+ test case For iPhone 6+'s, border-radius doesn't work well with <meta name="viewport" content="(list of properties here)">. Here is markup for a test page: <html> <head> <meta content="width=device-width,maximum-scale=1.0,initial-scale=1.0,minimum-scale=0.9,user-scalable=no" name="viewport"> <style> #test { border-radius: 8px; border: 8px solid rgba(255,255,255,0); border-left: 8px solid #777; } </style> </head> <body> <div id="test"> Test </div> </body> </html> Note that commenting out the border-radius style will fix the issue on iPhone 6+. Also, commenting out the border (with rgba(255,255,255,0)) will fix the issue. Commenting out the meta tag will also work. So it's some combination of those 3 things. This happens on any browser on an iPhone 6+. I'm attaching a screen shot from an iPhone 6+ with the problem showing (or really no border showing). I've tested before on iPhone 5 and there was no problem, but I don't have one available on me right now to take a screenshot. I have a screenshot from an android razr m that shows the border working, but apparently I can only attach one file here.
Attachments
iphone 6+ test case (74.93 KB, image/jpeg)
2015-07-21 12:27 PDT, narfity
no flags
Razr m test with no problem (18.93 KB, image/png)
2015-07-21 12:28 PDT, narfity
no flags
narfity
Comment 1 2015-07-21 12:28:51 PDT
Created attachment 257193 [details] Razr m test with no problem
David Kilzer (:ddkilzer)
Comment 2 2015-07-21 12:53:43 PDT
Thanks! Which version(s) of iOS have you tested on? Are you saying for the same version of iOS, the border-radius works on an iPhone 5, but fails to draw on an iPhone 6 Plus?
narfity
Comment 3 2015-07-21 13:17:21 PDT
The iPhone 6+ I'm testing on is currently on 8.0.2. I don't have a iPhone 5 handy so I can't check any version numbers. I was just trying to say that previously, an iPhone 5(i think it was an iPhone 5... might have been a 4 or 4s) properly rendered while an iPhone 6+ didn't. Unfortunately, I don't know what version of iOS the older phone was running. If I happen to be able to find an older iPhone to test on, I'll check on iOS version too.
Myles C. Maxfield
Comment 4 2015-07-21 13:30:04 PDT
This works for me on my iPhone 6 running iOS 9 beta
Myles C. Maxfield
Comment 5 2015-07-21 13:31:11 PDT
Also works for me on my iPhone 6 Plus running iOS 9 beta
Simon Fraser (smfr)
Comment 6 2015-07-21 13:32:18 PDT
Fixed in iOS 9 beta, if not before.
Myles C. Maxfield
Comment 7 2015-07-21 13:33:34 PDT
Wikipedia says the latest iOS 8 release is iOS 8.4. Perhaps you could try upgrading your phone's OS and see if the problem still reproduces.
narfity
Comment 8 2015-07-21 14:19:12 PDT
I updated to 8.4. Problem still reproduces. Hopefully beta 9 has fixed it.
Note You need to log in before you can comment on or make changes to this bug.