The border-radius style does not work in the Android browser.

I created a website that I intend to display on some mobile devices. The fact is that I created several menu options in the form of circles.

To achieve this effect, I use border-radius in the stylesheet, and -webkit-border-radius and-moz-border-radius too.

On the computer, it looks good in browsers (firefox and chrome), but when I go to the Android browser, these reset circles are square divs. This happens from the moment the page loads.

Can I use a different custom style for Android? Maybe I need something like jQuery mobile?

In short, I will put the code, but if someone went something like, could you share this information, please? thanks

+1
android browser css3
source share
2 answers

See this post for an answer: Galaxy S4 CSS3 browser support border-radius?

Just use extended border-left-radius, border-right-radius, etc. as a workaround; This is a crash in the new Android 4+ browser. an error report has been sent.

+2
source share

Hi, I am using this for the gradient. And it works great in most browsers.

`background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#B4DCFA), to(#FF0000)); -webkit-border-radius:11px; -webkit-box-shadow:0 1px 2px rgba(0,0,0,0.8); /* For WebKit (Safari, Google Chrome etc) */ /* For Mozilla/Gecko (Firefox etc) */ /* For Internet Explorer 5.5 - 7 */ /*-ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#B4DCFA, endColorstr=#FF0000); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#B4DCFA), to(#FF0000)); ` 

Can you send the code?

+1
source share

All Articles