IE CSS對齊問題

我的問題是我有兩個我需要對齊的下拉框。在Firefox中，它工作正常。基本上，一個國家的形式框，然後在它下面，另一個國家形式框。在IE中，這些框顯示爲彼此相鄰。我試圖對其進行設計，以便第一個表單下方出現第二個表單框。IE CSS對齊問題

我的HTML代碼（我砍掉了一些狀態，以便它會更容易閱讀）：

<div class="label">*Country:</div> 
<div class="field"> 
    <asp:DropDownList ID="country" CssClass="country2" runat="server"></asp:DropDownList>  
</div> 
<div class="label"></div> 
<div class="field"> 
    <asp:DropDownList ID="us_states" runat="server" CssClass="us_state_dropdown2"> 
    <asp:ListItem>-Select State-</asp:ListItem> 
    <asp:ListItem>Alabama</asp:ListItem> 
    <asp:ListItem>Alaska</asp:ListItem> 
    <asp:ListItem>Arizona</asp:ListItem> 
    </asp:DropDownList> 
</div>

爲類「標籤」，「場」，「COUNTRY2」和「us_state_dropdown2我的CSS代碼「：

.label {width: 195px !important; height: 28px; } 
.field {width: auto !important;} 
.country2 { width:212px !important;} 
.us_state_dropdown2 { width:212px !important;}

任何想法？

來源

2011-10-17 ndisdabest

是否有任何規則適用於'div'在該上下文中，如'float'？ – jball

完整的CSS（我省略了我認爲不相關的東西）： #contact_form .label {width：195px！important;身高：28px; } #contact_form .field {width：auto！important;} .question {float：left; width：100％;} .question .label {height：auto！important;} .question .field {margin-top：0px！important; } .country2 {width：212px！important;} .us_state_dropdown2 {width：212px！important;} – ndisdabest

您可以使用clear來避免元素位於您選擇的邊上。閱讀CSS參考資料，瞭解如何使用clear。 MDN Reference

來源

2011-10-17 18:32:13

即使我把「明確：既！重要」;對此，我仍然看到相同的行爲。這是我嘗試的第一件事情之一。 – ndisdabest

@ndisdabest，你能提供頁面的相關來源嗎？沒有ASP服務器的人可以更容易地測試答案。你可以粘貼到http://www.jsfiddle.net。 –

沒關係，我能弄明白。只是將它包裝在另一個DIV中，它似乎工作正常。 – ndisdabest

IE CSS對齊問題

回答

相關問題