Question

这很奇怪。我有以下结构：

<div id="iframe-wrapper">
    <iframe src="form.html"></iframe>
</div>

和CSS：

#iframe-wrapper {
    position: fixed;
    height: 350px;
    width: 200px;
}

iframe {
    width: 100%;
    height: 100%;
    border: none;
}

form.html 只包含：

<!DOCTYPE HTML>

<html>
<body>

    <form action="http://...">
        <input type="text" name="first_name" placeholder="First Name" required="required" />
        <input type="text" name="last_name" placeholder="Last Name" required="required" />
        <input type="email" name="email" placeholder="Email" required="required" />
        <input type="text" name="cellphone" placeholder="Cellphone" required="required" />
        <button type="submit">Sign Up!</button>
    </form>

</body>
</html>

现在，在Chrome中，当我点击输入字段时，没有任何反应。我应该看到一个闪烁的光标，但没有。如果我开始写作，仍然没有出现。 但是！如果我滚动页面，iframe显然会刷新，突然显示我写的内容。

如果我从position: fixed;移除#iframe-wrapper，一切都按预期工作。

我在Chrome中注意到了这种行为，但在FF中它运行正常。

我真的需要这个iframe有固定位置，有什么建议吗？

Chrome错误：固定位置容器中iframe内的表单输入似乎已冻结

0 个答案: