0

私はこのかなり珍しい問題を抱えています（他の人に尋ねたときに理解した後）、私のタグは他の要素によって使用されている画面の量を理解していないため、要素を画面から押し出します。
position：fixedの使用と関係があるのではないかと思いましたが、position-partを削除しても解決しなかったようです。

これは問題があるように見えるメインのマークアップですが、実際にはエラーが表示されないようです。

<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>

この問題は、＃searchresultsが#searchfieldによって#searchからプッシュされたように見えるこのjsFiddleで最もよく見られます。 私は本当に何が問題なのかわからないので、グーグルを使おうとすると、私の問題が実際にどこにあるのかについての良い答えがありません。

を変更するJSを削除しようとしましたが、ご覧のとおり、jsFiddleはJSをまったく実行していませんが、マークアップ/CSSは機能しません。

このフィドルでは、欠陥をわかりやすくするために、 ＃searchの高さが400pxに設定されています。ただし、100％の場合も同じエラーが発生します（これは本番コードで必要な値です）。

なぜこれが起こっているのか誰かが知っていますか？

4

2 に答える 2

0

これは、オーバーフローの問題が原因です。div「#searchfield」は他のコンテンツを押し下げています。

「height: 400px;」という行を削除して、高さを「auto」に設定します。「div#search」で「div#searchresults」に固定の高さを設定すると、問題が修正されます。

#search{
   height: 400px;
}

「div#search」の外に「div#searchfield」を入れることもできます。

<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 に答える