无法在输入文本字段中输入答案

【问题标题】：Cannot type in input text field无法在输入文本字段中输入
【发布时间】：2019-02-22 20:46:30
【问题描述】：

我无法在输入字段中输入内容。当我删除具有 id="viewport" 的第一个 div 时，我可以在输入字段中输入。我该如何解决这个问题？

<div id="viewport"></div>
<div class="form">
  <h2 id="h2">Need a project from<br>Google Cloud Storage?</h2>
  <form id="fileDownloadForm" method="GET" action="downloadBlob2" enctype="multipart/form-data">
    <input type="text" id="textBox" name="objectToSearch" placeholder="Type the name of the project here." />
    <button id="downloadBtn" type="submit" class="btn btn_primary">Download</button>
  </form>
</div>

【问题讨论】：

你能发布你的 CSS 吗？
不可重现。您可以自行测试此代码并查看它是否正常工作。也许您还有其他影响因素。
具体发布 CSS 什么是#viewport
没有 CSS，似乎工作正常。 jsfiddle.net/eLtc4mgq
感谢 cmets。我在 jsfiddle 中发布了我的代码，但随后收到了下面的答案。

标签： html css input

【解决方案1】：

你可以通过添加css属性#textBox{ z-index:1000; }来解决这个问题。似乎视口块太大并且溢出了输入字段。 z-index 使输入字段更“重要”——它越大，元素变得越重要。

【讨论】：

哈哈！我已经尝试过了，但是使用 z-index: 1. 1000 作品！谢谢你。您是否知道较高的 z-index 数或多个 z 索引是否需要更长的网页加载时间？
很高兴能帮上忙！ :) 不，我不这么认为。由于它只是 css 文件的一个属性，因此它只是向 css 文件添加了更多信息。老实说，我在工作中经常使用它，仍然没有注意到加载有任何问题。一切都加载得很顺利

【解决方案2】：

以防万一，对我有用的是放入即时标签。所以在这种情况下我会尝试把它放进去：

<div class="form" style="z-index: 1000 !important;">

【讨论】：

【解决方案3】：

在我的例子中，文本颜色以某种方式更改为white。我是在输入几个字符后不小心双击输入字段找到的。

【讨论】：