Galaxy S4 stock browser CSS3 border-radius support?

Dark Hippo picture Dark Hippo · Jun 19, 2013 · Viewed 11.9k times · Source

This is a very specific question, that I can't find any documented evidence to support, but have rather a lot of empirical evidence, although only based on a single phone.

The single Galaxy S4 that we have available in the office doesn't appear to have support for the border-radius property in it's stock browser. I've tested several different websites, and have tried all different browser versions of the property (webkit, moz, etc), and it just don't seem to support it.

Because we only have 1 S4 available (I've asked around, and no one else has one or knows anyone who does), and because rounded corners via the border-radius property was such a big feature of CSS3, I find it hard to believe that they would have removed it deliberately, which leads me to believe that either:

  1. I've found a bug with the stock browser, or
  2. It's device specific to the only phone we have available.

So, has anyone else come across this before, or does anyone have an S4 available to them that they could check on http://css3test.com/ to see if border-radius is supported?

Answer

aviomaksim picture aviomaksim · Jul 17, 2013

I had the same issue! You can fix it like that:

border-top-left-radius: 5px;
border-top-right-radius: 5px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;

PS. I hate such updates