Select tag's size attribute through css?

Question

Normally you can do this:

<select size="3">
    <option>blah</option>
    <option>blah</option>
    <option>blah</option>
</select>

And it would render as a selectionbox where all three options are visible (without dropping down)
I'm looking for a way to set this size attribute from css.

Answer 1

I do not believe this is possible no

Answer 2

I don't think that this is possible.

CSS properties are very generic (applicable to any element) and are unable to alter the functionality of an element in any ways (only the looks).

The size attribute is changing the functionality of the element at least in the case of size = 1 / size != 1.

Answer 3

Sucks. Thanks for the answers though.

@pilif:
I find it arguable to say that the functionality changes. It still basically offers a list of options where you can select one or more options from. Changing how many elements you can see at a time isn't changing anything to that.

I think wheter it is showing 1 element or multiple really is easthetics and thus should be css. Then again, nothing's gonna change because of that off course.

Answer 4

In general you can't add attributes set within html via CSS. You can add to the html using the pseudo selectors :before and :after, but that's about it, plus they still aren't compatible across all browsers. If you really need to do this, I think you'd have to resort to Javascript.

Answer 5

You can set the width of textboxes and the like through css though.
It actually is more acurate then the "character" unit you specify throught the element's size attribute.
But this is getting of track.

I hereby call this question closed (but don't have to points to do so)

Answer 6

There ins't an option for setting the size, but if you do set the size some browsers will let you set the width/height properties to whatever you want via CSS.

Some = Firefox, Chrome, Safari, Opera.

Not much works in IE though (no surprise)

You could though, if you wanted, use CSS expressions in IE, to check if the size attribute is set, and if so, run JS to (re)set it to the size you want... e.g.

size = options.length;

Answer 7

I disagree, I have been able to set select width and height using CSS with something like this:

select { width: 5em; height: 5em; }

Works in IE(7) as well as I just tested it.