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.<
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
We've managed to reproduce this with our Galaxy S4 stock browser, so it's probably something more than just your device.
Originally uploaded to twitter (the image)
I work with someone who received the May 30th firmware update and is seeing this same issue as well as some other CSS issues. I've not yet received that update and I'm on the April 24th version and I am not seeing this issue. Concerned that this is something introduced in the latest update.
I also encountered the same issue (Webview + stack browser Android 4.2.2 / Archos101 Xenon)
Fixed it by removing the background property from :
.circle {
width: 100px;
height: 100px;
background: rgba(255,255,255,0.75);
border: 5px solid rgba(255, 255, 255, 0.75);
border-radius: 50px;
}
and by adapting the width of the border property
.circle {
width: 100px;
height: 100px;
border: 50px solid rgba(255, 255, 255, 0.75);
border-radius: 50px;
}
I hope this can be helpful.