在IE中删除文本中的重叠输入图标

Question

屏幕截图示例：

样式：

padding-left: 40px;
background: url(../images/ico_03.png) no-repeat 11px 12px #f9f8f6;

问题：

我希望文字不会与图标重叠，就像在普通浏览器中一样：）

Answer 1

我建议你这样试试：

标记：

<div class="input"> 
    <div class="input-icon">&nbsp;</div>
    <input type="text" />
</div>

CSS：

div.input{
   position:relative;
}

div.input-icon{
   left: 40px;
   background: url(../images/ico_03.png) no-repeat 11px 12px #f9f8f6;
   position:absolute;
   z-index:2;
   top:0;
}

div.input input{
   padding-left:50px;
   position:relative;
   z-index:1;
}