文本缩进在ie7中不起作用

Question

我正在一个网站上工作,在顶部导航栏上有一个搜索框,我在搜索提交按钮上应用了以下css

#submit {
   background: url("img/new-search-icon.png") no-repeat scroll -1px 0 #FFFFFF;
   border:0 none;
   cursor:pointer;
   display:block;
   height:21px;
   padding:0;
   position:absolute;
   right:0;
   text-indent:-9999px;
   top:0;
   width:20px;
   z-index:2;
}

我的问题是在IE7中文本缩进不起作用请帮助我如果你想看到你可以点击这里查看的演示点击这里.请帮我.

Answer 1

添加此CSS以使IE7运行:

text-transform: capitalize;

疯狂但真实.

Answer 2

在实现上述图像替换技术的同时,有一些规则可以使用css使其在IE浏览器上运行.

css声明:

text-indent:-9999px;
text-transform:capitalize;


font-size:0;
display:block;
line-height:0;

font-size:0用于减小字体大小,在IE7中运行良好.但即使在添加此行之后,您也会注意到IE6中按钮中心的黑线(基本上是文本).

display:block负文本缩进仅在IE中添加.

line-height:0 IE6的另一个修复.

text-transform:capitalize我不知道包含该属性的确切原因,不知何故它修复了这个问题.

希望这可以帮助.

Answer 3

我不知道 xc2xb4t 是否是您问题的原因，但我认为您的background简写符号是错误的；颜色代码应该位于开头，而不是末尾。

\n