似乎没有设置溢出Y的高度

时间:2018-10-23 11:39:07

标签: html css

我正尝试将我的页面内容设置在透明标头下方,如我的网站所示。但是,将包装的高度设置为100%时,不会出现围绕包装内容的溢出y的情况。内容的高度足够大,可以在设置为自动时显示。如何使包装器的高度等于页面的高度,而不包括页眉的高度,以便滚动?

我的网站:https://fortnitematcher.com

包装器

<div class="wrapper">
        <div class="content">
            <div class="mainContainer" style="">
                <div class="containerTitle">Matchmaking for Fortnite with FortniteMatcher</div>
                gtgwgrtgr<br>gtgwgrtgr
            </div><br>
            <div class="mainContainer" style="float: left; width: 780px;">
                <div class="containerTitle">Matchmaking for Fortnite with FortniteMatcher</div>
                gtgwgrtgr<br>gtgwgrtgr
                <div class="containerTitle">Matchmaking for Fortnite with FortniteMatcher</div>
                gtgwgrtgr<br>gtgwgrtgr
                <div class="containerTitle">Matchmaking for Fortnite with FortniteMatcher</div>
                gtgwgrtgr<br>gtgwgrtgr
                <div class="containerTitle">Matchmaking for Fortnite with FortniteMatcher</div>
                gtgwgrtgr<br>gtgwgrtgr
                <div class="containerTitle">Matchmaking for Fortnite with FortniteMatcher</div>
                gtgwgrtgr<br>gtgwgrtgr
                <div class="containerTitle">Matchmaking for Fortnite with FortniteMatcher</div>
                gtgwgrtgr<br>gtgwgrtgr
            </div>
            <div class="mainContainer" style="float: right; width: 280px;">
                <div class="sideContainerTitle">Matchmaking for Fortnite with FortniteMatcher</div>
                gtgwgrtgr<br>gtgwgrtgr
            </div>
        </div>
    </div>

样式:

.wrapper {
        margin-top: 75px;
        width: 100%;
        overflow-y: auto;
        /*height: 90%;*/
    }
    .content {
        padding-top: 25px;
        margin-left: auto;
        margin-right: auto;
        min-height: 1000px;
        background: rgba(0, 0, 0, 0.5);
        width: 1130px;
    }
    .mainContainer {
        padding: 15px;
        background: rgba(0,0,0,0.7);
        -webkit-box-shadow: 0 0 82px 5px rgba(0,0,0,0.4) inset;
        -moz-box-shadow: 0 0 8px 5px rgba(0,0,0,0.4) inset;
        box-shadow: 0 0 8px 5px rgba(0,0,0,0.4) inset;
        box-shadow: 0px 2px 5px #000;
        color: grey;
        width: 1100px;
        min-height: 100px;
        margin-bottom: 10px;
        display: inline-block;
    }

0 个答案:

没有答案