CODEWITHSUNDEEP
htmlcss
Savvas_cl
Savvas_cl

Reputation: 34

Difference in placeholder text color and select dropdown

Hello I would like to ask a question regarding css style.

I put the same color value in the placeholder text and also in a select dropdown. But the color that the browser shows differs.

Anyone can explain why this happens?

Here is an example: http://scratchpad.io/abounding-coat-5186

edit: What I want to achieve is exactly the same text-color. I dont want that opacity effect that the placeholder has.

Upvotes: 0

Views: 1395

Answers (2)

oboshto
oboshto

Reputation: 3627

You can rewrite placeholder styles with this pseudo-classes/pseudo-elements

input::-webkit-input-placeholder { /* Chrome/Opera/Safari/ */
   color: red;
   opacity: 1;
}

input:-moz-placeholder { /* Firefox 18- */
   color: red;  
   opacity: 1;
}

input::-moz-placeholder {  /* Firefox 19+ */
   color: red;  
   opacity: 1;
}

input:-ms-input-placeholder {  /* IE */
   color: red;  
   opacity: 1;
}

JSfiddle here

Upvotes: 3

Ismail Farooq
Ismail Farooq

Reputation: 6837

I think you want to change placeholder. here how to change placeholder color 

::-webkit-input-placeholder {
   color: red;
}

Read More

Upvotes: 0

Related Questions