html - CSS:当我将它的高度设置为 100% 时，我的边栏溢出容器 div 的边框

Question

当我将它的高度设置为 100% 时，我的边栏溢出了容器 div 的边框，我想知道是否有任何方法可以使它的高度 100% 减去一些像素。

这是来源:

<div id="main">
    <br /><br />
    <div class="content">
        <div id="sidecontent">
            <h1 id="title">Title</h1>
            *****
        </div>
        <div id="sidebar">
            <div class="sidebox">
                ****
            </div>
        </div>
    </div>
    <div class="bottom"></div>
</div>


#main {
        position: relative;
    background:transparent url('/public/images/main_bg.png') top left repeat-y;
    padding:37px 37px 37px 37px;
    margin-left: auto ;
    margin-right: auto ;
    width:940px;
    min-height: 363px;
        }
        #main div.top, #main div.bottom {
        height:70px;
        width:1015px;
        position: absolute;
        left:0px;
        }

        #main div.content {
        padding:0 15px 0 15px;
        }

        #sidecontent {
        width: 675px;
        }

        #sidebar {
                background: #fff url('/public/images/bg_side.png') top right repeat-y;
        position: absolute;
        height: 100%;
                right:34px;
                top:42px;
        width: 200px;
        padding: 10px 10px 0px 40px;
                z-index:50;
        }

        .created_at {
        color:gray;
        }       

        .sidebox {
        margin-bottom: 5px;
        }

    #main div.top {
        top:-70px;
        background: transparent url(/public/images/main_top.png) bottom no-repeat;
        }

    #main div.bottom {
        bottom:-70px;
        background: transparent url(/public/images/main_bottom.png) top no-repeat;
        }

Answer 1

试着看看这个 article看看你能不能跟上。它描述了如何使用 CSS 技术使两列的高度相同。