5

何が間違っているのかわかりませんが、#contentに背景色を適用するのに問題があります。ただし、高さの値を800pxに設定すると、正常に機能します。ただし、このテンプレートはサイト全体で使用されるため、自動または100%にする必要があります。アドバイスをいただければ幸いです。

<div class="content_bg">
    <div id="content">
        <div id="contentLeft">   
        </div>
        <div id="contentRight"> 
            <div id="ContentPane" runat="server" />           
        </div>
    </div>
</div>
<div class="footer_bg">
    <div id="footer">
        <div id="footerLeft">            
        </div>
        <div id="footerRight">           
        </div>
    </div>
</div>

/*
====================================================================
Content Area
====================================================================
*/

.content_bg
{
    background:#dadad9 url(images/interior_content_bg_top.jpg) repeat-x center top;
    overflow:hidden;
}

#content
{
    width:980px;
    margin:auto; 
    height:auto; 
    background:#fff; 

}

#contentLeft
{
    float:left;
    width:209px; 
    margin-top:50px;   
}


#contentRight
{
    float:right;
    width:770px; 
    margin:20px 0 0 0;
}

/*
====================================================================
Footer
====================================================================
*/

.footer_bg
{
    background:#dadad9 url(images/interior_footer_bg.jpg) repeat-x center top;
    clear:both;
}

#footer 
{
    width:980px;
    height:258px;
    margin:auto;
    background:#dadad9 url(images/interior_footer.jpg) no-repeat center top;
}
#footerLeft
{
    width:400px;
    height:50px;       
    float:left;
    padding: 20px 0 0 25px;    
}

#footerRight
{
    width:100px;
    height:50px;       
    float:right;
    padding: 20px 0 0 0;
}
4

4 に答える 4

18

#contentのオーバーフローをautoに設定します。

#content {
    width:980px;
    margin:auto; 
    height:auto; 
    background:#fff; 
    overflow:auto;
}
于 2013-02-19T21:12:05.023 に答える
4

問題は、#contentコンテンツがないことです。divの高さを使用height:100%しているため、親divの高さ全体に拡張されます(つまり.content_bg)。ただし、.content_bgコンテンツもありません。したがって、100%ゼロまで拡大しています。

于 2013-02-19T21:11:58.913 に答える
0

IDにクラスを追加して、クラスを<div id="content" class="content_bg">消去してみてください。そして、あなたのクラスにこれらのプロパティを与えます

.content_bg
{
    background-color: white;
    width: 100%;
    height: 100%;
}

次に、ID「content」のコンテンツが幅と高さを定義します。

于 2013-02-19T21:18:41.720 に答える
0

#contentフロートをクリアしなかったため、背景の適用に問題があります。追加

<div style="clear:both"></div>

    <div id="contentLeft">   
    </div>
    <div id="contentRight"> 
        <div id="ContentPane" runat="server" />           
    </div>
于 2013-02-19T21:18:43.903 に答える