Gravity forms Select Placeholder styling

Question

I have a gravity forms select field (dropdown) where i want to style the placeholder only. I hope someone can help me.

The form produces the following code:

<select name="input_10" id="input_4_10" class="medium gfield_select" tabindex="11">
 <option value="" selected="selected" class="gf_placeholder">Type of Business</option>
 <option value="Media">Media</option>
 <option value="Retail">Retail</option>
 <option value="Travel">Travel</option>
 <option value="Other">Other</option>
</select>

I want the gf_placeholder to have a different font-color and weight then the actual options. I've tried several things, but either it changes all the options or none. What am i missing? I think it has something to do with the dom. This is the scss that changes the correct item as soon as you open the dropdown:

.ginput_container_select select:first-child  {
    color:  $placeholder-color;
    @include font-size(16);
    font-weight: bold !important;
}

But as soon as you close the dropdown it goes back to the unstyled version.

Thanks in advance!

Answer 1

To apply Placeholder Styling on all your forms

/* Other Fields */
.gform_wrapper .gform_fields .gfield input::-webkit-input-placeholder {color: #ffffff;}

/* Paragraph Text Area */
.gform_wrapper .gform_body .gform_fields .gfield textarea::-webkit-input-placeholder {color: #ffffff;}