У меня есть div класса field_wrapper, который содержит 3 sub divs field_label, field_input и field_error

Мне нужно поместить field_label, field_input рядом и field_error ниже первых двух.

Пожалуйста, смотрите ниже код CSS, чтобы узнать, как я достиг этого, моя проблема в том, что он не работает в IE7. сбросить оба примененных к field_error не работает.

Даже после долгого поиска в Google я не могу найти подходящий способ исправить это без добавления разметки HTML. Пожалуйста, совет css tip или любой другой метод, чтобы избежать лишнего кода разметки

.field_wrapper
{
 clear:both;
}

.field_label
{
 float:left;
 width:40%;
}
.field_input
{
 float:left;
 width:40%;
}
.field_error
{
 clear: both;
 color:#FF0000;
 float: right;
 text-align:left;
 width: 60%;
}

<form method="post" action="http://localhost/locations/add">
 <div class="field_wrapper">
  <div class="field_label">
   <label for="location_add_name">Name</label>
  </div>
  <div class="field_input">
   <input type="text" id="location_add_name" value="" name="name">
  </div>
  <div class="field_error">
   <p>The Name field is required.</p>
  </div>
 </div>
 <div class="field_wrapper">
  <div class="field_label">
   Address
  </div>
  <div class="field_input">
   <textarea id="location_add_address" rows="12" cols="90" name="address"></textarea>
  </div>
  <div class="field_error">
  </div>
 </div>
 <div class="form_submit">
  <input type="submit" value="Add" name="submit"> 
 </div>
</form>