I can't seem to be able to define a height for a <select> even setting it to display:block
select{
height: 100px; /* ignored */
display: inline-block;
}
Any idea why?
-edit-
I am using google chrome
Asked
Active
Viewed 112 times
1
Toni Michel Caubet
- 19,333
- 56
- 202
- 378
-
10it's working for me. What browser are you using – SyntaxLAMP Feb 13 '14 at 10:11
-
Better to use `padding: 40px 0;`. The text does not center in FireFox. The height is working in Chrome and FireFox. – AfromanJ Feb 13 '14 at 10:11
-
I am using google chrome – Toni Michel Caubet Feb 13 '14 at 10:16
-
Which version, which platform? – damian Feb 13 '14 at 10:18
-
1try using developer tools and inspect the element to see if any other css is being applied to it – anurupr Feb 13 '14 at 10:20
-
Does this work for you? http://jsfiddle.net/3Vz9Y/3/ – damian Feb 13 '14 at 10:21
-
in chrome its working perfect – Amb Feb 13 '14 at 10:21
-
which version of Chrome? Have you tried updating? Working fine here. – Joeri Hendrickx Feb 13 '14 at 10:26
3 Answers
0
If you're working on a Mac, make sure to put
-webkit-appearance: none;
above the styling attributes, eg:
select {
-webkit-appearance: none;
height: 100px;
display: inline-block;
}
Then you can style to your hearts content.
DanOrchard
- 26
- 4
-
Apologies, JunM has answered this correctly, I should learn to read answers before answering - sorry about that JunM – DanOrchard Feb 13 '14 at 11:44
-2
Try this Code..
Now this code works in all browsers...
CSS
select
{
min-height:20px;
display: block;
}
Html
<select>
<option>hi</option>
</select>
KesaVan
- 1,031
- 16
- 32
-
-
@ToniMichelCaubet is the select tag wrapped in to some other tag??? or you are having the – Amarnath Balasubramanian Feb 13 '14 at 11:10
-
your fiddle doesn't work for me, and of corse is wrapped with other tag, I don't have any body with just a select ;) – Toni Michel Caubet Feb 13 '14 at 12:32