Check out http://demo.neeraj.name/admin_data in both Chrome and Firefox. In Firefox the select box has large height. In Chrome the height of select box is very small.
How do I make the select box of chrome and safari look like the select drop down of Firefox?
Since the priority is given to the inline-styling, you can use this trick to increase the height of your select list. All you have to do is add inline-style in the select tag.
To override a set height in a CSS element, you can simply put this in the inherited element (either in a style block or inline): height: auto; This will override the set value inherited, without statically setting a new one.
I've run into this problem before
Setting the height of the select element works fine on webkit in Windows, but fails on webkit on a Mac.
If you set the css attribute
-webkit-appearance: menulist-button;
It will allow the height to work properly on a Mac, but it creates this weird black border on windows. You can adjust the border by setting the css border property, but that changes the look on all browsers that let you style select borders, not just webkit.
At this point, i gave up, but hopefully that is a good starting point if you want to investigate further.
Increase the line-height
.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With