Label Width Not Working

Hi all, this is my first post in here and hope I don't sound like too much of a noob, but I am having an issue with label width and spacing the input boxes from the labels. I found some css in my Joomla! template that overwrote the CF css, so I completely erased all of that css from the template so the CF css could takeover. However, I am still having the issue even when I configure label width in the wizard or the code itself. I have attached a screenshot to this message so you can see my problem and also, below is my form's code and the original CSS that was overwriting the CF css.

I appreciate anyone's help in advance.

FORM CODE:

<div class="form_item">
  <div class="form_element cf_heading">
    <h3 class="cf_text">Request a Quote</h3>
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_text"> <span class="cf_text">Use this form below to request a quote. Please be sure to include all of your contact information and as much information as possible so we can return a prompt response.</span> </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">Your Name</label>
    <input class="cf_inputbox required validate-alpha" maxlength="150" size="45" title="" id="text_2" name="text_2" type="text" />
  
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">Company</label>
    <input class="cf_inputbox required" maxlength="150" size="45" title="" id="text_3" name="text_3" type="text" />
  
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">Phone Number</label>
    <input class="cf_inputbox required validate-number" maxlength="35" size="25" title="" id="text_4" name="text_4" type="text" />
  
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">Email Address</label>
    <input class="cf_inputbox required validate-email" maxlength="150" size="30" title="" id="text_6" name="text_6" type="text" />
  
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">Origin City</label>
    <input class="cf_inputbox" maxlength="150" size="45" title="" id="text_7" name="text_7" type="text" />
  
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">State</label>
    <input class="cf_inputbox" maxlength="10" size="10" title="" id="text_11" name="text_11" type="text" />
  
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">ZIP</label>
    <input class="cf_inputbox" maxlength="15" size="15" title="" id="text_14" name="text_14" type="text" />
  
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">Destination City</label>
    <input class="cf_inputbox" maxlength="150" size="45" title="" id="text_15" name="text_15" type="text" />
  
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">State</label>
    <input class="cf_inputbox" maxlength="10" size="10" title="" id="text_16" name="text_16" type="text" />
  
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">ZIP</label>
    <input class="cf_inputbox" maxlength="15" size="15" title="" id="text_17" name="text_17" type="text" />
  
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textarea">
    <label class="cf_label" style="width: 150px;">Commodity Type(s)</label>
    <textarea class="cf_inputbox" rows="3" id="text_19" title="" cols="30" name="text_19"></textarea>
    
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">No. of Pallets</label>
    <input class="cf_inputbox" maxlength="10" size="10" title="" id="text_20" name="text_20" type="text" />
  
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">Deck Space</label>
    <input class="cf_inputbox" maxlength="150" size="20" title="" id="text_21" name="text_21" type="text" />
  
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">Weight</label>
    <input class="cf_inputbox" maxlength="150" size="15" title="" id="text_23" name="text_23" type="text" />
  
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_checkbox">
    <label class="cf_label" style="width: 150px;">Equipment</label>
    <div class="float_left">
      <input value="Van" title="" class="radio validate-one-required" id="check00" name="check0[]" type="checkbox" />
      <label for="check00" class="check_label">Van</label>
      <br />
      
<input value="Reefer" title="" class="radio validate-one-required" id="check01" name="check0[]" type="checkbox" />
      <label for="check01" class="check_label">Reefer</label>
      <br />
      
<input value="Flat" title="" class="radio validate-one-required" id="check02" name="check0[]" type="checkbox" />
      <label for="check02" class="check_label">Flat</label>
      <br />
      
<input value="Step" title="" class="radio validate-one-required" id="check03" name="check0[]" type="checkbox" />
      <label for="check03" class="check_label">Step</label>
      <br />
      
<input value="Other" title="" class="radio validate-one-required" id="check04" name="check0[]" type="checkbox" />
      <label for="check04" class="check_label">Other</label>
      <br />
      

    </div>
    
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textarea">
    <label class="cf_label" style="width: 150px;">Equipment Comments</label>
    <textarea class="cf_inputbox" rows="3" id="text_25" title="" cols="30" name="text_25"></textarea>
    
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textarea">
    <label class="cf_label" style="width: 150px;">Other Comments or Specifics</label>
    <textarea class="cf_inputbox" rows="3" id="text_26" title="" cols="30" name="text_26"></textarea>
    
  </div>
  <div class="cfclear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_button">
    <input value="Submit" name="button_19" type="submit" />
  </div>
  <div class="cfclear"> </div>
</div>

Original (deleted) CSS in template:

/* FORM
--------------------------------------------------------- */
form {
	margin: 18;
	padding: 18;
}

form label {
	cursor: default;
	font-size: 100%;
	margin-right: 100px;

}

input, select, textarea, .inputbox {
	padding: 2px 6px;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 100%;
}

.button {
	padding: 2px 3px;
	background:url(../images/button_bg.gif) repeat-x;
	color: #444;
	font-size: 80%;
	border:1px solid #ccc;
	text-transform: uppercase;
}

.button:hover, .button:focus {
	border: 1px solid #999999;
	background: #fff;
	color: #333;
}
.search .button {
	padding: 0px 3px;
	background:#fff;
	color: #999;
	font-size: 90%;
	text-transform: none;

}

.search .button:hover, .search .button:focus {
	color: #333;
}

* html .button {
	padding: 2px 0 !important; /*IE 6*/
}

*+html .button {
	padding: 2px 0 !important; /*IE 7*/
}

.inputbox {
	border: 1px solid #CCCCCC;
	background: #FFFFFF;
}

.inputbox:hover, .inputbox:focus {
	background: #FFFFCC;
}

Hi trendwebsolutions,

Plese try setting "Load ChronoForms CSS/JS Files" to 'Yes' on the form General Tab.

Bob

Hi trendwebsolutions,

Plese try setting "Load ChronoForms CSS/JS Files" to 'Yes' on the form General Tab.

Bob

Bob, thank you for the reply. The CSS/JF files is already set to 'Yes'...

Nevermind, sorry! I forgot that I deleted the CSS files in the default theme folder. I reloaded it and it looks fine for now.