Я пытаюсь создать сетку/таблицу в CSS, где каждая ячейка содержит некоторый контент. Тем не менее, содержимое первой строки обрезается контентом во второй строке. Я предполагаю, что мне нужно увеличить высоту каждой ячейки, но всякий раз, когда я использую свойство height, ничего не меняется. Вот код:Невозможно установить высоту отображения: таблица в CSS
HTML
<div class="grid-container outline">
<div class="row">
<div class="col-0"><p>Featured</p></div>
</div>
<div class="row">
<div class="col-1">Content Here</div>
<div class="col-1">Content Here</div>
<div class="col-1">Content Here</div>
</div>
<div class="row">
<div class="col-1">Content Here</div>
<div class="col-1">Content Here</div>
<div class="col-1">Content Here</div>
</div>
</div>
CSS
.grid-container {
width: 100%;
max-width: 1200px;
margin: 0 auto;
border-top: 12px solid #03A3D3;
}
.row:before,
.row:after {
content:"";
display: table ;
clear:both;
}
.col-1 {
width: 20%;
float: left;
padding: 20px;
}
.col-1 > p {
background-color: #03A3D3;
padding: 0;
margin: 0;
text-align: center;
color: white;
}
Спасибо!
Использование ширина окна и высота – Geeky