在 IE 中单击无法访问 z-index 的文本输入答案

【问题标题】：Text input with z-index inaccessible by click in IE在 IE 中单击无法访问 z-index 的文本输入
【发布时间】：2011-07-16 16:55:31
【问题描述】：

我有一个无边框文本输入和一个悬停在其他图形上方的图像输入。你可以在这里看到它：http://www.wwmlaw.dreamhosters.com/index.php

您可以在 IE6 和 IE8 中进入文本输入，然后它会接受输入，但单击它不会给您一个光标。测试的所有其他浏览器都可以正常运行。

CSS 是这样的：

#homeSearchForm {
    position:absolute;
    z-index:1000;
}

#homeSearch {
    position:absolute;
    z-index:1000;
    width:230px;
    height:20px;
    border:none;
    top:16px;
    _top:14px;
    left:676px;
    _left:730px;
    border:none;
    background:none;
    color:#FFF;
}

#homeSearchButton {
    position:absolute;
    z-index:1000;
    width:55px;
    height:20px;
    border:none;
    top:17px;
    _top:15px;
    left:600px;
    _left:655px;
}

有什么想法吗？

【问题讨论】：

标签： css internet-explorer forms

【解决方案1】：

有类似的问题 -> IE8 文本框不可编辑（当我的应用程序的包装器具有位置：绝对时）。单击仅在边框中起作用。填充颜色和透明也不起作用。通过此文档类型更改，问题得到解决。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

来源：http://www.codingforums.com/showthread.php?p=1173375#post1173375

【讨论】：

【解决方案2】：

基于这个问题

Input boxes with transparent background are not clickable in IE8

我添加了一个仅限 IE 的背景图片：

<!--[if IE]>
<link href="css/IE.css" rel="stylesheet" type="text/css" />
<![endif]-->

包含

background-image:url(../g/spacer.gif);

这解决了问题。

【讨论】：