Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>

Change color of Place holder last character

Change color of Place holder last character

Problem

I have a form with inputs having placeholders showing * for required field in addition to helper text.

What i want is to change the Color of * i.e. last character of placeholder

Is there any selectors for that? In addition to below selector, selecting a placeholder;

input::-webkit-input-placeholder (for webkit browsers)

enter image description here

thanks in advance!

Problem courtesy of: Aamir Shahzad

Solution

A bit tricky, and you'll have to check yourself for the different browsers' support, but here is a Fiddle Demo for you :-)

html

css

input::-webkit-input-placeholder:after{color:red;content:" *";}

Just moved the * to be a part of the :after element, and styled it separately.

Solution courtesy of: Ronen Cypis

Discussion

View additional discussion.



This post first appeared on CSS3 Recipes - The Solution To All Your Style Problems, please read the originial post: here

Share the post

Change color of Place holder last character

×

Subscribe to Css3 Recipes - The Solution To All Your Style Problems

Get updates delivered right to your inbox!

Thank you for your subscription

×