Use CSS to automatically add 'required field' asterisk to form inputs

Question

What is a good way to overcome the unfortunate fact that this code will not work as desired:

    Name:         


        
      

Answer 1

.required label {
    font-weight: bold;
}
.required label:after {
    color: #e32;
    content: ' *';
    display:inline;
}

Fiddle with your exact structure: http://jsfiddle.net/bQ859/