Question

This is probably a dumb question – I’m using Jquery to validate the form. So the form elements have the class=”required” attribute.

input type="text" name="last_name" class="required"/>

Now if i want to apply some css properties to the input fields of this form – how do I do that.

• I do not want to declare a general css for all input elements – I have declared the css as follows:

input.form
{
    color: #000;
    background: #fff;
    border: 2px solid #E1E1E1;
    font-size: 16pt;    
    width:150px;
}

And I want to use it this way

input class="form" type="text" name="last_name" class="required"/>

But this wont work as there are two class attributes here.
So how do I handle this.
Thanks

Answer 1

You can add as many classes for each element as you like. In your code you would declare this like:

<input class="form required" type="text" name="last_name" />

Any to apply special CSS rules to input elements only containing the “required” class, just add the following:

input.required
{
    color:#f00;
}