Select item in forms gets rounded corners only on OSx!


I’m working on a page for and I have an issue with the select form item that I believe to be a bug.

As you can see below, the select item that I use is set to no radius all around, and it works fine on windows, chrome and edge. However, when I view it on Chrome from my macbook it appears to be having radius all over. Exactly as the images below show.

I looked into the forum and found this code below. It fixed the radius issues but it removed the dropdown arrow!!

 <style type="text/css">
input, textarea {
-webkit-appearance: none;
border-radius: 0; } </style>

You can check it here

Please let me know how to solve the issue.


Hi @Sambatia, thanks for the question. Check out this article: Removing rounded corners from a <select> element in Chrome/Webkit - Stack Overflow

The last comment on the solution I think may be something to try. I hope this helps!

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.