radiobutton werden nicht nebeneinander platziert

[inspiron]

...nun möchte ich die Label's Ja / Nein vom Radio verbreitern. Wenn ich das mit ".radio {width:} mache, wird das Radio im IE so angezeigt

LABEL
O Ja
O Nein

Im FF wird es richtig angezeigt, oder so wie ich es gern möchte.

  
<style type="text/css">  
label, input, select {border: 1px solid;} /* Dass man auch was sieht */  
  
select, option, input {display: block;}  
  
label {  
    display: inline-block;  
    float: left;  
    width: 21%;  
    margin-left: 5px;  
    margin-right: 5px;  
    }  
  
label span {display: block;}  
input[type="radio"] {display: inline; /*margin-bottom: 4px; */}  
input[type="checkbox"] {display: inline; /*margin-bottom: 4px; */}  
  
.radio {width: 200%;}  
  
</style>  

  
<fieldset>  
<legend>Elemente nebeneinander</legend>  
  <label>Username  
  <input id="in_user" type="text" value=""/></label>  
    	  
  <label for"störung" id="störung"><span>Störung</span>	  
  <label for="checkbox"><input type="checkbox" id="störung" name="störung" />Ja</label>  
  </label>  
				  
  <label for"onair" id="onair"><span>ONAIR</span>	  
  <span class="radio"><label for="radio1"><input type="radio" id="radio1" name="radio" />Ja</label></span>  
  <span class="radio"><label for="radio2"><input type="radio" id="radio2" name="radio" checked="checked" />Nein</label></span>  
  </label>  
  
</fieldset>