Question

In my forms, I want to make HTML labels bold in general, but not bold when they are labelling radio buttons and checkboxes.

How can I do that in a CSS that can be imported and works by default, without requiring local overrides of the styling?

Example Radio Label (should not be bold)

<label for='banana'> <input type='radio' name='banana' id='banana' value='banana' />Banana </label> 

Example non-Radio Label (should be bold)

<label for='id'>ID</label> <input type='text' size='12' id='id' name='id' /> 

The way I’m associating labels can be changed if it helps.

Thanks!

Answer 1

You can’t do that without giving the right labels a class or by using Javascript. With jQuery selectors you could do that:

$('label:not(:has(radio))').addClass('boldmenow'); ... .boldmenow {   font-weight: bold; }