0
Я не могу найти способ удалить 13 пикселей свободного пространства под изображением. Я бы хотел, чтобы div был одинаковым размером изображения, но был отзывчивым. Я попытался добавить отступы и разметку, но ничего не изменилось. Спасибо!Bootstrap 4 grid «cube»
html, body {
font-family: "Helvetica";
height: 100vh;
margin: 0;
}
.flex-center {
align-items: center;
display: flex;
justify-content: center;
}
.position-ref {
position: relative;
}
.content-white {
background-color: #fff;
color: #000;
width: 100%;
text-align: center;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
flex-direction: row;
-webkit-align-items: center;
align-items: center;
flex-wrap: wrap;
min-width: 320px;
max-width: 1220px;
}
/* image grid */
#css-table {
display: table;
}
#css-table .col {
display: table-cell;
width: 33%;
}
.clearboth {
clear: both;
}
.cube {
vertical-align: middle;
font-size: 50px;
border: 1px solid #000;
}
.cube-text {
}
.cube img {
width:100%;
}
.cdesc {
font-family: "Helvetica Light";
font-size: 16px;
} <div class="flex-center position-ref">
<div id="css-table" class="content-white">
<div>
<div class="col cube">
<img src="http://placehold.it/400x400" />
</div>
<div class="col cube cube-text">
TEXT
<p class="cdesc">Lorem ipsum dolor sit amet <br/> Lorem ipsum dolor sit amet.</p>
</div>
<div class="col cube">
<img src="http://placehold.it/400x400" />
</div>
<div class="clearboth"></div>
<div class="col cube cube-text">
TEXT
<p class="cdesc">Lorem ipsum dolor sit amet <br/> Lorem ipsum dolor sit amet.</p>
</div>
<div class="col cube" >
<img src="http://placehold.it/400x400" />
</div>
<div class="col cube cube-text">
TEXT
<p class="cdesc">Lorem ipsum dolor sit amet <br/> Lorem ipsum dolor sit amet.</p>
</div>
</div>
</div>
</div>
Большое спасибо! –