How to add padding to my select input options? Here is my CSS and all options seem below each other without any spacing (in terms of height of option) I have a CSS reset.. aside from that how can I give the options a bit of height to make it look good?
.upload-input select {
display: block;
font-size: 14px;
color: #888;
width: 616px;
background: #fff;
border: 1px solid #ccc;
}
Update
I applied the suggested css. It does not look right.
For vertical padding you can use line-height. If you don't need border, you can specify border and make it the same color as the select element background, it will give you padding appearance. box-shadow can be used to add stroke to the element if really needed.
When you want to add space around an HTML element's content then you'll use the padding properties. The padding shorthand property allows us to set the padding on all four sides at once instead writing out padding-top , padding-right , padding-bottom , padding-left .
Try
.upload-input select option { padding: 6px;}
You might have to fiddle with the .upload-input select css though.
Like:
.upload-input select {height: 35px;}
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