- index.html
- style.css
HTML
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title>Блоки одинаковой высоты</title>
<link href="setting.css" rel="stylesheet">
<link href="style.css" rel="stylesheet">
</head>
<body class="subtle">
<article class="todos">
<h1>Список дел Кексика</h1>
<div class="columns">
<section>
<h2>Дело №1</h2>
<p>Проснуться, сделать зарядку.</p>
</section>
<section>
<h2>Дело №2</h2>
<p>Совершить экспедицию на кухню, полакомиться рыбкой и икрой из холодильника.</p>
</section>
<section>
<h2>Дело №3</h2>
<p>Передохнуть от тяжких трудов, поспать.</p>
</section>
<section>
<h2>Дело №4</h2>
<p>Навести беспорядок, покусать человека за пятки, сбросить с полки цветочный горшок.</p>
</section>
<section>
<h2>Дело №5</h2>
<p>Выкрасть сметану из холодильника.</p>
</section>
<section>
<h2>Дело №6</h2>
<p>Выяснить отношения с соседским котом.</p>
</section>
</div>
</article>
</body>
</html>
CSS
.columns {
}
.columns section {
float: left;
width: 140px;
}
Вы перешли на другую страницу
Кликните внутри мини-браузера, чтобы поставить фокус в это окно.
ЗадачиВыполнено
0
- Блоку
.columnsзадайте раскладку флексбокса - и перенос флекс-элементов на новую строку.