css フォームのプルボタンを使う場合

質問

cssでselect（プルダウンメニュー）を定義すると、
その後のフォーム（例えばテキストフィールド）のレイアウトが崩れます。
お詳しい方、ご教授いただければ幸いです。

=======================================
html側の記述です
=======================================
<form accept-charset="UTF-8" action="/mmm" >
<div style="margin:0;padding:0;display:inline"></div>

<div class="field">
<label for="vvv">氏名</label>
<input id="vvv_name" name="vvv[name]" size="30" type="text">
</div>

<div class="field">
<label for="xxx">好きな果物</label>
<select id="xxx" name="site[ftp_id]"><option selected="selected" value=""></option>
<option value="1">りんご</option>
<option value="2">さくらんぼ</option></select>
</div>

<div class="field">　<!--＃ここのレイアウトが崩れます-->
<label for="yyy">好きな動物</label>
<input id="yyy" name="yyy[yyy]" size="30" type="text">
</div>
</form>

=======================================
cssの記述です
=======================================
* {
margin: 0;
padding: 0;
}

.field
{ width:500px;}

.field label {
width:230px;
float:left;
color:#FFFFFF;
background-color:#001207;
display:block;
height: 2em;
line-height :2em;
margin-top:10px;
}

.field input {
width:200px;
float:left;
color:#FFFFFF;
margin-top:10px;
height: 2em;
}

.field select {
width:200px;
float:left;
color:#FFFFFF;
margin-top:10px;
height: 2em;
}

どうぞよろしくお願い致します。

回答No.1

myuki1232

IE は別として、Firefox, Chrome, Opera でチェックしましたが、特に崩れているようには見えません。（コメント部分は消した状態で）
どういうふうに崩れているのでしょうか？

お礼

ご回答ありがとうございます。

＿＿＿＿＿＿＿　この部分をテキストフィールドに例えると

以下のように崩れます。

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

氏名　　　　　　　＿＿＿＿＿＿＿＿＿
好きな果物　　　　＿＿＿＿＿＿＿＿＿

　　　　　　　　　好きな動物
＿＿＿＿＿＿＿＿＿

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

尚、Dreamweaverを使用しておりますが、ソフト上では崩れておりませんが
Firefox, Chromeのブラウザで確認すると崩れます。

対策方法がございましたら、ご教授いただけましたら幸いです。