2013-04-22 293 views
0

我需要創建自己的下拉列表,以便可以使用其他屬性創建服務器控件。大多數情況下,這一切進展順利,但我遇到了一個問題。對於下拉箭頭,我只是在CSS中使用背景圖像。但問題是,任何延伸過圖像的文本都會覆蓋該圖像。任何人都有關於如何將背景圖像保留在頂部或隱藏超出圖像位置的任何文本的任何想法?這裏是我的代碼,到目前爲止:將div背景圖片放在頂部

.tbSearchDefault 
    { 
    border-top:1px solid #abadb3; 
    border-right:1px solid #dbdfe6;   
    border-bottom:1px solid #e3e9ef; 
    border-left:1px solid #e2e3ea; 
    background-image:url('images/ddlMouseOut.gif'); 
    background-repeat:no-repeat;  
    background-position:right; 
    cursor:default; 
    } 

<table cellpadding="0" cellspacing="0" style="border-collapse: collapse;"> 
    <tr> 
    <td> 
     <asp:TextBox ID="tbSearchName" runat="server"      
       CssClass="tbSearchDefault" > 
    </asp:TextBox>      
    </td> 
</tr>    

+0

您是否嘗試過使用'z-index'? https://developer.mozilla.org/en-US/docs/CSS/Understanding_z-index – 2013-04-22 14:36:06

+0

你有沒有嘗試將'z-index'屬性設置爲2? – Niro 2013-04-22 14:36:15

+0

或者你可以給你的文本框填充相同數量的背景圖片寬度爲 – Morpheus 2013-04-22 14:44:54

回答

0

好吧,似乎沒有辦法做到這一點。實際上,我猜背景圖像是背景。我最終做的只是在文本框旁邊添加一個div,並在那裏添加圖像。

0

很難正是你需要有什麼說什麼,但是我相信你正在尋找z-index CSS

https://developer.mozilla.org/en-US/docs/CSS/Understanding_z-index

這將使你先設置什麼棧,等等。

.tbSearchDefault 
{ 
    z-index: 99; // Sets this class to be over any other element unless z -index is higher. 
} 
+0

我想過使用z-index,但是如何爲文本框中的背景圖像設置z-index? – jason 2013-04-22 14:47:03

+0

您將該類設置爲高z-索引,我想我將不得不看到您正在嘗試做什麼以給出更精確的解決方案的示例。 – 2013-04-22 17:24:47

+0

我想也許你想要這樣的東西:http://stackoverflow.com/questions/611482/change-color-and-appearance-of-drop-down-arrow – 2013-04-22 17:36:31