select placeholder?

[Julix91]

This CSS code .has-float-label select:placeholder-shown:not(:focus) + * doesn't make sense to me. select can't have a placeholder attribute, it would have to be handled via a selected / disabled / hidden option. - Of course that's where the css only solution comes to the edges of what it can do - unless I'm missing something here.

https://codepen.io/Julix/pen/EXpVjz

Anyone know of a CSS way of getting the select's "placeholder" (i.e. disabled option) to display the label (and not when other things are selected)? -- Else, what's a simple js solution for this?

[tonystar]

That's right. <select> support is limited.

My suggestion is to toggle some .placeholder-shown class for <select> fields via JS => that should allow to reuse the same styling.

[Julix91]

That's not a bad idea. Guess that's what JS is for, right? :)