1 reply [Last post]
Last seen: 7 years 15 weeks ago
Timezone: GMT-4
Joined: 2009-03-29
Posts: 38
Points: 60

I have a css class called twoColumnform for a two column form, it has a property, label width as 200px.

form.twoColumnform label{
		width: 200px;
		float: left;
		text-align: right;
		margin-right: 0.5em;
		display: block

Here is html using this class

<form  class="twoColumnform" >
				                      <label for="audit_number" >Audit Number: </label> 
				                      <input type="text"   id="audit_number" />
				                      		<label for="grantee_name" >Grantee Name:</label> 
				                       		<input type="text"   id="grantee_name"  size="60" />
					                      	<label for="ein" >EIN: </label>
					                        <input type="text"   id="ein" />
									  <label for="duns" >DUNS: </label>
									  <input type="text"    id="duns" />
				                      <label for="city" >City: </label>
				                      <input type="text"  id="city" />

In some cases I want to extend the width of the label in the form, I can do it by adding style property for each label inside the form with a desired value, but I have to do it for every label, and changing it back is rewrite all a pain, or create A new class just for this form with the desired label width.

Is there a better option to override a property for a css class , Please suggest.

Tony's picture
Last seen: 1 day 9 hours ago
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5344
Points: 2965

Hi fachhoch, On what

Hi fachhoch,
On what occasions are you wanting to change the label?
is there a trigger like screen width or is it on different pages/forms?