Есть ли способ установить высоту изображения в процентах (100%) в классе столбца начальной загрузки?

Я создаю 2 столбца в классе Container-Fluid и вставляю изображение в первый столбец с высотой и шириной 100%, ширина работает, но высота не работает

bootcamp.html:~

<div class="container-fluid">
<div class="row ">
<div class="col-lg-6 padding-0"><img src="assets/images/2.jpeg" >
</div>
<div class="col-lg-6 padding-0 ">there should be a form </div>
</div>
</div>

bootcamp.css:~

.container-fluid{
height: 100%;
width: 100%;
padding-left: 0px;
padding-right: 0px;
}
.row{
height: 100%;
width: 100%;
margin: 0px;
}
.row .col-lg-6 img {
width: 100%;
height: 100%;
}
.padding-0{
padding-right:0;
padding-left:0;
}

Всего 1 ответ


Если вы хотите, чтобы ваш контейнер и изображения в нем имели высоту экрана 100% (область просмотра), то используйте height:100vh как сказал Амит.

Но если вы хотите 100% высоты родительского div ( col-lg-6 в вашем случае), то вы можете сделать position: relative; height: whatever-you-like родителя position: relative; height: whatever-you-like position: relative; height: whatever-you-like и position: absolute; height: 100%; width: 100%; изображения position: absolute; height: 100%; width: 100%; position: absolute; height: 100%; width: 100%; ,


Есть идеи?

10000