[Reactive] Change default text visibility in Dropdown placeholder


I'm trying through CSS to create a default display text for the dropdown widget similar to a dropdown search, in the dropdown search the default value has an opacity of 0.5.

The snipet bellow will affect all selections in the placeholder, I only want to affect the default option.

[data-dropdown] select.dropdown-display{

        opacity: .5;


Tryed the approach below and no luck.

[data-dropdown] select.dropdown-display[value="-1"]{

   opacity: .5;


Any help woul be apreciated.

Samuel Anjos



Hi Samual,

As far as I know this is not possible with pure css. 

You have to put some logic based on selected value, for example create a css class with desired style and on dropdown's style classes property apply this style with condition

If(value = 0, "yourclass", "")

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.