0

我有这个相当不寻常的问题（在我询问其他人时理解之后），似乎我的 -tags 不了解其他元素使用了多少屏幕，因此将元素推出屏幕。
我认为这可能与使用位置有关：固定，但在删除位置部分时似乎并没有解决它。

这是似乎有问题的主要标记，我真的看不到任何错误。

<div id="search">
    <div id="searchfield">
        <span id="searchinput">
            <input type="text" id="s" name="s" />
        </span>
        <button>Search</button>
    </div>
    <div id="searchresults">
        <ul class="longlist">
        </ul>
    </div>
</div>

这个问题在这个jsFiddle中最为明显，似乎#searchresults被#searchfield推出了#se ​​arch。
因为我真的不知道问题出在哪里，所以任何使用谷歌的尝试都让我无法很好地回答我的问题到底出在哪里。

我已经尝试删除任何修改的 JS，我们可以看到 jsFiddle 根本没有运行任何 JS，我的标记/CSS 仍然不起作用。

在这个小提琴中， #search的高度设置为 400px，以更好地显示缺陷。但是当它是 100% 时会发生同样的错误（这是它在生产代码中应该具有的值）。

有谁知道为什么会这样？

4

2 回答 2

0

这是由溢出问题引起的。div“#searchfield”正在下推其他内容。

通过删除行“height: 400px;”将高度设置为“auto” 在“div#search”上并在“div#searchresults”上设置固定高度可以解决问题。

#search{
   height: 400px;
}

将“div#searchfield”放在“div#search”之外也可以。

<div id="searchfield">...</div>
<div id="search">...</div>

这些方法表明溢出问题是由混合相对高度和绝对高度引起的。您应该将一些与高度相关的样式从“div#search”移动到“div#searchresults”以解决此问题。

于 2012-12-01T14:19:00.210 回答
0

它似乎在

 #search{
   height: 100%;
 }

不？

关联：

http://jsfiddle.net/KX9BV/8/

于 2012-12-01T14:19:39.850 回答