Asp.net 文本显示在img顶部的下拉列表中，并在IE8中输入

我有一个“输入前”下拉列表，它充当下拉列表的UI

<input type="text" value="" name=" " class="txtfield">
<asp:DropDownList runat="server" ID="ddAMT" SkinID="Form" DataSourceID="LDSAMT" DataTextField="xyz" DataValueField="ABC" Width="220px" CssClass="dd" AppendDataBoundItems="true" AutoPostBack="true" OnSelectedIndexChanged="index">
</asp:DropDownList>

.txtfield{
background: url("img.png") no-repeat scroll 98% center #fff;
position: absolute;
width: 175px;
border-radius: 4px;
padding-right:26px;
overflow:hidden;}

.dd{
background-position: left center;
height: 32px;
opacity: 0;    
filter: alpha(opacity = 0);
padding-left: 5px;
text-align: left;
width: 209px;
position : relative;
z-index : 10;
display:inline-block;}

.txtfield{
背景：url（“img.png”）无重复滚动98%中心#fff；
位置：绝对位置；
宽度：175px；
边界半径：4px；
右边填充：26px；
溢出：隐藏；}
.dd{
背景位置：左中；
高度：32px；
不透明度：0；
过滤器：alpha（不透明度=0）；
左侧填充：5px；
文本对齐：左对齐；
宽度：209px；
位置：相对位置；
z指数：10；
显示：内联块；}

---

我的问题是，在IE8中，如果下拉选项text是more，则显示文本的文本框将位于图像的顶部，直到完全变宽，这不应该发生，因为输入被赋予了填充权。它在FF、Chrome中运行良好，即它在img.png之前隐藏文本

请显示实际的HTML，而不是服务器端的.NET源代码。