簡體   English   中英

CSS 100vh未將div設置為100%高度

[英]css 100vh is not setting the div to 100% height

如下面的屏幕截圖所示

在此處輸入圖片說明

視口高度大約覆蓋97%,而不是100%。 下一節可以看到。 我在這個問題上停留了幾個小時,以下是我的CSS和HTML代碼

的CSS

html, body {
     width: 100%;
    height: 100%;
}

.section-3 {
    background: url(../images/section-3-bg.jpg) center center;
    background-size: cover;
    position: relative;
    height:100vh;
}

的HTML

<section class="section-3 col-xs-12" id="demand">
    <section class="container">
        <center>
            <div id="trapezium"></div>
                <h1 class="blue big-font">On Demand Charters</h1>
                <img src="images/demand-border.png" alt="" class="img-responsive" style="width:auto;">
                <div class="col-md-7 col-md-push-2">
                <p class="medium-font">With Powerfly, access a range of aircraft from light 
                                       to large jets, turboprops and helicopters 
                                       either through on-demand charters. All you need to
                                       do is book and a Powerfly executive will customise
                                       your plan as per your needs.
                </p>
                <h2 class="explore-btn"><a href="demand.html">Details</a></h2>
            </div>
        </center>
    </section>
</section>

真正的問題是輪播!

#carousel-generic-1 {
    margin-top: 0;
}

效果很好..您沒有截取該section的完整屏幕截圖,但實際上已取代了應有的位置。

但是,由於height: 100vh; ,它會切掉按鈕height: 100vh;

在此處輸入圖片說明

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM