CODEWITHSUNDEEP
jqueryhtmlcss
Rob
Rob

Reputation: 6380

Target specific character within value

I have the following input text field (via a Mailchimp signup form):

<input type="text" value="First name*" name="FNAME" class="required" id="mce-FNAME"/>

  1. Is it possible to make the value two different colours? I want to make the value of value attribute of the input tag that contains "First name" with black and the "*" with red.

  2. Is there a way to do this without losing the Mailchimp form functionality that it preserves?

Upvotes: 0

Views: 103

Answers (2)

Rob
Rob

Reputation: 6380

I've gone with the following:

.required {
    background-image: url('images/rwcmd-asterisk.png')!IMPORTANT;
    background-repeat:no-repeat!IMPORTANT;
    background-position:97% 16%;
    }

Wasn't ideal but had no other choice really.

Upvotes: 1

mmertel
mmertel

Reputation: 397

You could modify the content to something like this:

<p class="required">
    <input type="text" value="First name" name="FNAME"
        class="required" id="mce-FNAME" />
</p>

CSS:

p.required:after {
    color:red;
    content:"*";
}

http://jsfiddle.net/uAKEa/

Upvotes: 0

Related Questions