Chrome user agent border-radius overrides my style for select
This is a little dated but I figured it should be answered nevertheless.
You have to add appearance: none to apply styling to those elements.
The appearance property is used to display an element using a platform-native styling based on the users' operating system's theme.
For more details see https://css-tricks.com/almanac/properties/a/appearance/
input, select { width: 150px; border-radius: 50%; -webkit-appearance: none; -moz-appearance: none; appearance: none;}<select> <option>foo</option> <option>bar</option></select><br><br><input>