3

以下の基本構造のサイトがあります。このサイトの背景は白で、画像は1回だけ表示されますが、代わりhtml{ }にCSSの宣言から色を継承している必要があります。背景を持つべき要素の下にあるすべての要素は透明であり、背景が追加されていても(Firebugでチェックされています)、これはで定義された背景の下にあるようですhtml{ }

overflow: none;これは、宣言をから削除してからのみ発生しました#content-containerが、以前と同様に機能しました。ただし、これを削除する必要があります。サイトで発生している変更では、ナビゲーションメニューにドロップダウンが必要であるため、下のコンテナはオーバーフローを許可する必要があります。

これが発生している特定のCSSの理由はありますか?または、誰かが助けられるようにするために私が提供する必要がある他の何か?ありがとう。

<div id="main-container">

    <div id="header-container">
        <div id="header-top">
            {Code}
        </div>

        <div id="header-middle">
            {Code}
        </div>

        <div id="header-nav">
            {Code}        
        </div>
    </div>

    <div id="content-container">
        <div id="content-left" class="index">  
            {Code}
        </div>

        <div id="content-right">
            {Code}
        </div>
    </div>

    <div id="footer-container">
        {Code}
    </div>

</div>
4

1 に答える 1

4

#content-left#content-right要素が浮かんでいると思いますか?その場合、overflow: none上の#content-containerは要素を自己クリアさせていました。これがないと、要素内のすべての要素がフロートしているため、要素の高さがなくなり、コンテナの高さを計算できなくなります。

を使用する必要がある場合overflow: visible、回避策は、 setが設定されdivた包含要素の最後にを配置clear: bothすることです。

<div id="content-container">
    <div id="content-left" class="index">  
        {Code}
    </div>

    <div id="content-right">
        {Code}
    </div>

    <div class="clear"></div>
</div>
.clear { clear: both; }
于 2012-04-26T08:43:21.703 に答える