對齊第一和最後一個名字

我有這樣的page，我要對齊的第一個和最後的名字，我不知道是什麼原因造成的姓氏是第一個名字下面...任何想法對齊第一和最後一個名字

這裏是我的HTML

<div id="double-mc-field-group" class="mc-field-group"> 
    <span class="left_name"><label for="mce-FNAME">First Name</label>&nbsp;<input id="mce-FNAME" name="FNAME" type="text" /></span> 
    <span class="right_name"><label for="mce-LNAME">Last Name </label>&nbsp;<input id="mce-LNAME" name="LNAME" type="text" /></span> 
</div> 
<div id="after_name" class="mc-field-group"> 
    <label for="mce-EMAIL">Email Address <strong class="note-required">*</strong></label>&nbsp; 
    <input id="mce-EMAIL" class="required email" name="EMAIL" type="text" /> 
</div>

和我的CSS

#columns-container .left_name{ 
    float:left; 
    width:220px; 
} 

#columns-container .left_name input, #columns-container .right_name input{ 
    width:200px; 
} 

#columns-container .right_name{ 
    float:right; 
    width:220px; 
} 

#columns-container #after_name{ 
    clear:both; 
} 

#columns-container .mc-field-group{ 
    width:220px; 
} 

#columns-container #double-mc-field-group{ 
    width:440px; 
}

任何想法我做錯了......我想我可以靜靜地飄浮左側和右側，設置寬度爲一半的部分，它會b e對齊...不知道我錯過了什麼

來源

2011-06-01 Trace

你似乎是積極編輯HTML，但我看到的原因是'＃列容器的.mc場組{寬度：220px;}'是影響持有兩跨的股利。跨度浮動，但總體寬度爲440px，導致它們纏繞。 – 2011-06-01 02:03:19