1

I'm using bootstrap v3.3.1 (the regular directory) and I can't success to remove the border radius from the select box components (in chrome).

This question is not duplicated because:

  • I already tried to change the bootstrap border-radius variables
  • I already tried to add "(-webkit/-ms)border-radius: 0(px) !important" to the css
  • I don't want the to add "-webkit-appearance: none;" to the css because I want the arrows of the select-component
Siguza
  • 21,155
  • 6
  • 52
  • 89
Bokris Itzhak
  • 911
  • 9
  • 30
  • like I said in the bold section, the solutions from other questions didn't work for me – Bokris Itzhak Nov 22 '14 at 19:12
  • Yes I've realized that after, sorry, removed my previous comment. BTW, there was a solution for the arrow as a comment of that answer, can't it work for you? (http://stackoverflow.com/questions/24210132/remove-border-radius-from-select-tag-in-bootstrap-3#comment42091112_24766039) – Veve Nov 22 '14 at 19:17
  • I tried and it's also a terrible solution – Bokris Itzhak Nov 22 '14 at 19:23

1 Answers1

0

Try Using this and it works for me

add form-control class in your select tag

and add this css

.form-control{
border-radius:0px;
}
Jon
  • 384
  • 6
  • 18