如何在Safari中使用css背景图像解决向下列表对齐？ [英] How to resolve Down list alignment using css background image in Safari?

问题描述

我创建了Web应用程序。我有DropDown列表和应用css Back groud图像到下拉列表。它工作在FF，IE，Opera，Chrome。但在Safari浏览器中无效。



我的代码：

Hi,

I have created web application. I have DropDown List and applied css Back groud image to Dropdown list.Its working in FF,IE,Opera,Chrome .but in Safari browser is not working.

My Code:

.adempsrch li select {
    padding:8px;
    background:url(../images/bg_input1.gif)  top left repeat-x;
    border: 1 !important;             /*Removes border*/
    width:80%;
    border:1px solid #666;
    margin-left:0px;
    float:left;


    /*-webkit-appearance: none;
    -moz-appearance: none; */



}
<ul class="adempsrch" >
        <li>
           <asp:Label ID="lblStatus" runat="server" Text="Status"></asp:Label><br />
           <asp:DropDownList ID="ddlStatus" runat="server">
           <asp:ListItem >All</asp:ListItem>
           <asp:ListItem Selected="True" >Active</asp:ListItem>
           <asp:ListItem >InActive</asp:ListItem>
           </asp:DropDownList>
        
        </li>

 Css Backgroud image is set in safari browser.
Please help me.

Thanks in Advance.

推荐答案

这将有效....

This will work....

<asp:dropdownlist cssclass="ddl" id="ddlGraduateYear" runat="server" xmlns:asp="#unknown" />

CSS ..

CSS..

.ddl {
    width: 70%;
    border: 2px solid #c7c7c7;
    height: 35px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-top: 0px;
    border-radius: 0px;
    display: inline-block;
    -webkit-appearance:none;
    background-image: url('../Images/CommonImages/dropdownarrow.png');
    background-position: right;
    background-size: 25px 25px;
    background-repeat: no-repeat;
    text-indent: 0.01px; /*In Firefox*/
    text-overflow: '';
    vertical-align:middle;

}

这篇关于如何在Safari中使用css背景图像解决向下列表对齐？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！