Deverill
Deverill

Reputation: 971

Style an ASP:Textbox placeholder with CSS?

I have an email address asp:TextBox in an asp:UpdatePanel on my page that has a placeholder. I need to make the placeholder text light gray without affecting the data entered by the visitor:

<table>  
<tr>  
</tr>  
  <asp:UpdatePanel ID="EditAddressAjax" runat="server" UpdateMode="Conditional">
   <ContentTemplate>
     <tr>
       <asp:TextBox ID="TicketUserEmail" runat="server" MaxLength="250" placeholder="Tickets will be emailed to this address."></asp:TextBox>
     </tr>
etc.

I can't figure out the CSS I need to do this. placeholder doesn't even show in intellisense. I only want to affect this field in my page/site.

Upvotes: 1

Views: 6988

Answers (1)

Chris G
Chris G

Reputation: 780

You can use the following:

:placeholder-shown {
  color: orange;
}

And for all browsers:

::-webkit-input-placeholder { /* Safari, Chrome and Opera */
  color: orange;
}

:-moz-placeholder { /* Firefox */
  color: orange;
}

:-ms-input-placeholder { /* IE 10+ */
  color: orange;
}

::-ms-input-placeholder { /* Edge */
  color: orange;
}

:placeholder-shown { /* Default */
  color: orange;
}

Upvotes: 3

Related Questions