控制風格覆蓋

我有以下ASP.Net代碼控制風格覆蓋

... 
<div style="width: 40%; float: left; margin-left: 15px"> 
    <b>County:</b> 
    <asp:ComboBox ID="cboCounty" runat="server" MaxLength="0" 
    AutoCompleteMode="SuggestAppend" CssClass="EPSCombo"> 
    </asp:ComboBox> 
    <br /> 
...

問題：這個div包含許多組合框的，他們並不如預期顯示，他們都有EPSCombo類。當我調試CSS我發現它是被重寫，這裏是從螢火

enter image description here

我EPSCombo風格如下（覆蓋默認AjaxToolkit CSS）

.EPSCombo .ajax__combobox_inputcontainer .ajax__combobox_textboxcontainer input 
{ 
    margin: 0; 
    border: solid 1px #7F9DB9; 
    border-right: 0px none; 
    padding: 1px 0px 0px 5px; 
    font-size: 13px; 
    height: 18px; 
} 
.EPSCombo .ajax__combobox_inputcontainer .ajax__combobox_buttoncontainer button 
{ 
    margin: 0; 
    padding: 0; 
    background-image: url(../images/windows-arrow.gif); 
    background-position: top left; 
    border: 0px none; 
    height: 21px; 
    width: 21px; 
} 
.EPSCombo .ajax__combobox_itemlist 
{ 
    border-color: #7F9DB9; 
}

和輸出包含EPSCombo的CSS文件是Master頁面中包含的最後一個。

問題：它可能已經有一段時間了，因爲我做了web開發，但是如果我決定CSS控件不應該具有最高優先級並且應該覆蓋其他所有內容，那麼正確嗎？如果是這樣，那麼爲什麼我的組合框樣式（高度，寬度，邊距和填充）正被覆蓋？我沒有任何其他類型的設置Firebug中顯示的值的高度和寬度。 Loki的回答

更新後，我想我應該補充這一點，添加!important這些屬性可以解決這個問題，但我想給這個根本原因，看看事情發生了錯誤。

來源

2013-07-19 Jafar Kofahi

正如你所看到的重寫樣式一樣，線樣式具有最高優先級，所以你需要檢查你的代碼，可能是你在代碼中添加這些樣式或者可能使用java腳本。 –

我有這種擔心，但正如我所說我沒有任何其他地方，分配這些具體的價值觀，也在我的問題，我只顯示一個組合框，但'Div'有更多，他們每個人都有不同的價值。在我的JS中，我通常不會更改控件的CSS。有沒有一種方法可以搜索或查看我的控件樣式是否正在被JS修改？ –

@JafarKofahi如果你有權訪問.js文件 - 你可以搜索類名或元素標籤，看看他們正在做什麼 –

您的組合框可能會繼承它所包含的<div>的樣式，或者可能會從其高於那。既然你沒有指定一個「類」或「ID」屬性爲它其中包含的DIV，該分區可能會從你的CSS文件中檢索的風格，如果你有這樣的：

div 
{ 
    height: 21px; 
    margin: 0px; 
    padding: 0px; 
    width: 21px; 
}

要強制你的組合框採取獨立的造型雖然你可以使用ASP style屬性，像這樣：

<asp:ComboBox ID="cboCounty" runat="server" MaxLength="0" 
AutoCompleteMode="SuggestAppend" style="margin: 0;padding: 0;height: 21px;width: 21px;"> 
</asp:ComboBox>

這應該是在可以在你的應用程序會干擾其他任何造型的最高優先級。雖然認爲編程實踐不當，但它可能會幫助您縮小問題的範圍。

乾杯，埃裏克

編輯我還要提到的是你的CSS代碼是爲了解釋從最具體到最不特定的標籤定義。例如，div.menu比div更具體，這可能發生在樣式表的其他地方。

This也是一個很好的文章來看待描述繼承。希望這可以幫助！

來源

2013-07-19 19:39:41 Eric

有趣所以繼承樣式會覆蓋給定的CssClass？我將閱讀有關繼承..感謝 –

+1 @Eric指出繼承..這是問題的一半。下半場我仍在試圖弄清楚。寬度和高度都在某處進行計算，並在HTML輸出中分配爲內聯值 –

快速修復 - 將!important標誌添加到樣式表中。除非有其他標誌定義了同一個元素的相同屬性，否則它們將具有更高的優先級

來源

2013-07-19 19:32:11

是的，加入'！important'就可以解決這個問題，但我不想每次發生時都添加它。我想找到它發生的原因：是我的CSS文件搞砸了，是我或我的團隊中的任何人做一些造型在JS W/O實現它，...等但感謝 –

控制風格覆蓋

回答

相關問題