How to Change Placeholder Text Color in Form

Sometimes we face in a problem with Contact form’s field’s Placeholder color when develop different colors and types of contact forms. If we use html5 or Bootstrap default contact forms we get a default color of placeholder text. Sometimes it does not match with the template color or mock-up color. Then we try to change the color with the CSS code like input

{color:#EFEFEF;}

. But it does not change the color of placeholder text. It actually change the color of typing text into the field.

Now I’ll give the solution of the problem. We need to apply the CSS code like this,

/*Placeholder Colors*/
.form-control::-webkit-input-placeholder {
color:#fff;
}
.form-control:-moz-placeholder { /* Firefox 18- */
color:#fff;
}

.form-control::-moz-placeholder { /* Firefox 19+ */
color:#fff;
}

.form-control:-ms-input-placeholder {
color:#fff;
}

You can change the color code as you want and You do not have to use the same class . Use the class which you used in your input or textarea field .

Then the color code will work perfectly.

Have Fun


2 Comments

  • Sharon Cervantes

    January 18, 2017

    This is a comment to the website creator. I came to your How to Change Placeholder Text Color in Form – Mostafizur Rahman page by searching on Google but it was difficult to find as you were not on the front page of search results. I know you could have more visitors to your website. I have found a website which offers to dramatically increase your rankings and traffic to your website: http://dtl.la/z-HEZ} I managed to get close to 500 visitors/day using their service, you could also get many more targeted visitors from search engines than you have now. Their services brought significantly more visitors to my site. I hope this helps!

    Reply
  • Alison Hamilton

    January 19, 2017

    I was just looking at your How to Change Placeholder Text Color in Form – Mostafizur Rahman site and see that your site has the potential to become very popular. I just want to tell you, In case you don’t already know… There is a website network which already has more than 16 million users, and most of the users are looking for websites like yours. By getting your site on this service you have a chance to get your site more popular than you can imagine. It is free to sign up and you can read more about it here: http://thfox.com/500s – Now, let me ask you… Do you need your website to be successful to maintain your way of life? Do you need targeted traffic who are interested in the services and products you offer? Are looking for exposure, to increase sales, and to quickly develop awareness for your website? If your answer is YES, you can achieve these things only if you get your site on the network I am talking about. This traffic service advertises you to thousands, while also giving you a chance to test the service before paying anything. All the popular blogs are using this network to boost their traffic and ad revenue! Why aren’t you? And what is better than traffic? It’s recurring traffic! That’s how running a successful site works… Here’s to your success! Read more here: http://www.esdlink.de/67

    Reply

Leave a Reply