我知道這個問題已經被問過了，但我嘗試了一切，但我沒有找到解決方案，所以我再次問，我很抱歉:-)。
我試圖讓我的行填滿頁面的所有剩余螢屏空間，但是，我的行永遠不會縮小，它保持在他的初始大小。
請注意，我的地圖適合 div 的大小。
這是我正在使用的代碼：
<div class="row">
<div class="col-xl-12 col-md-12 mb-12 col-lg-12 ">
<div class="card shadow mb-4 h-100">
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between">
<h6 class="m-0 font-weight-bold text-primary">
Carte des balises
</h6>
</div>
<div class="card-body">
<div id="map"></div>
</div>
</div>
</div>
</div>
還有頁面的渲染：
如果有人能給我一些線索，我將不勝感激！
提前致謝， ：）
uj5u.com熱心網友回復：
<div class="card shadow mb-4 h-100">
這里的h-100類說它的父元素和父元素的高度為 100%
<div class="col-xl-12 col-md-12 mb-12 col-lg-12 ">
沒有高度設定。此外，html 中的所有塊標簽元素都沒有開箱即用定義的高度，而是取決于它的子元素。
所以你需要做的是在父級上設定一個高度，例如：
在 HTML 中：添加一個類
<div class="col-xl-12 col-md-12 mb-12 col-lg-12 map-height">
CSS：定義類如下
.map-height{
min-height:calc( 100vh - 300px )
}
300 px 在這里是硬編碼的，但是您需要計算頁眉高度 具有 4 個大標簽的部分高度 頁腳高度假設這 3 個部分具有靜態高度設定。
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/429625.html
標籤：javascript html css 推特引导 引导程序 4