cool
cool

Reputation: 3495

Value/Placeholder - different styling for words

I'm having problem with placeholders. I want to ask, is there possibility to style value in input fields but in the way to style words of that value different.

For example, if we have input field which have initial value "First Name" i want to have green color for "First", and red color for "Name" (this is just an example).

Is this even possible?

Note: Im using value as "placeholder" (instead of placeholder html attribute) because of ie.

<input type="text" value="First Name" onFocus="if (this.value == 'First Name') {this.value = '';}" onBlur="if (this.value == '') {this.value = 'First Name';}" />

Upvotes: 4

Views: 1185

Answers (2)

Ram
Ram

Reputation: 144659

unfortunately its not possible. when it comes to styling the form elements, there are many hindrances, color can be set to for an element not chracters, try this:

http://jsfiddle.net/Fgd2e/1/

Upvotes: 3

fb55
fb55

Reputation: 1227

You may change the color of an input using the color style attribute. Having separate colors for each word is much harder. You need to have an overlay that displays the right colors. Besides, the cursor would disappear, so that the user wouldn't know where he currently is.

Upvotes: 0

Related Questions