即使没有内容,如何强制DIV块扩展到页面底部?

在下面显示的标记中,我试图使内容div一直延伸到页面底部,但是只有在有要显示的内容时才拉伸。我要这样做的原因是,即使没有任何内容要显示,垂直边框仍会在页面下方显示。


这是我的HTML:


<body>

    <form id="form1">

    <div id="header">

        <a title="Home" href="index.html" />

    </div>


    <div id="menuwrapper">

        <div id="menu">

        </div>

    </div>


    <div id="content">

    </div>

而我的CSS:


body {

    font-family: Trebuchet MS, Verdana, MS Sans Serif;

    font-size:0.9em;

    margin:0;

    padding:0;

}

div#header {

    width: 100%;

    height: 100px;

}

#header a {

    background-position: 100px 30px;

    background: transparent url(site-style-images/sitelogo.jpg) no-repeat fixed 100px 30px;

    height: 80px;

    display: block;

}

#header, #menuwrapper {

    background-repeat: repeat;

    background-image: url(site-style-images/darkblue_background_color.jpg);

}

#menu #menuwrapper {

    height:25px;

}

div#menuwrapper {

    width:100%

}

#menu, #content {

    width:1024px;

    margin: 0 auto;

}

div#menu {

    height: 25px;

    background-color:#50657a;

}


BIG阳
浏览 1233回答 3
3回答
打开App,查看更多内容
随时随地看视频慕课网APP