如何修复ASP.NET AjaxToolkit ComboBox的风格？

Question

我是一名新的ASP.NET开发人员，我正在尝试使用ASP.NET AjaxControlToolkit。我喜欢ComboBox控件，我试图在its website HERE中使用它（它）。

我只是将它拖放到我的简单页面中，然后将样式应用到它。但是，它没有像在其网站上那样正确显示。

ASP.NET代码：

<div>
        <asp:ComboBox ID="ComboBox1" runat="server" DropDownStyle="DropDownList"
                            AutoCompleteMode="SuggestAppend" CssClass="AjaxToolkitStyle" AppendDataBoundItems="false">
                    <asp:ListItem>Select</asp:ListItem>
                    <asp:ListItem>All</asp:ListItem>
                </asp:ComboBox>
    </div>

CSS代码：

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
}

body, div, p, h1, h2, h3, h4, ul, li, table
{
    margin:0;
    padding:0;
    border:none;
}
/* ComboBox styles */
#master_content .ajax__combobox_itemlist
{
    margin: 0px;
}

.AjaxToolkitStyle .ajax__combobox_inputcontainer .ajax__combobox_textboxcontainer input
{
    background-image: url(ComboBox/images/toolkit-bg.gif);
    background-position: top left;
    border: 0px none;
    color: #FFFFFF;
    padding: 4px 0px 3px 5px;
    font-size: 13px;
    height: 16px;
    width: 240px;
}
.AjaxToolkitStyle .ajax__combobox_inputcontainer .ajax__combobox_buttoncontainer button
{
    background-image: url(ComboBox/images/toolkit-arrow.gif);
    background-position: top left;
    border: 0px none;
    height: 23px;
    width: 23px;
}
.AjaxToolkitStyle .ajax__combobox_itemlist
{
    border-color: #0F2543;
    background-color: #EFEFEF;
}

以下是我所拥有的快照：

那么我该如何解决这个问题？

Answer 1

使用

position: relative;
top: -7px;

.AjaxToolkitStyle .ajax__combobox_inputcontainer .ajax__combobox_textboxcontainer input

中的

相应调整顶部