! [Желаемый результат] 1
[! [Текущий результат (примечание: изображение было слишком велико для размещения здесь, но просто представьте все изображения с колоннами)работает до нижней части окна
.wrapper {
display: grid;
grid-gap: 5px;
grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
grid-auto-rows: 75px;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS Grid</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="wrapper">
<div class="vertical"><img src="img/p1.jpeg" alt=""></div>
<div class="horizontal"><img src="img/p15.jpeg" alt=""></div>
<div><img src="" alt=""><img src="p2.jpeg" alt=""></div>
<div class="vertical"><img src="img/p14.jpeg" alt=""></div>
<div><img src="img/p3.jpeg" alt=""></div>
<div><img src="img/p4.jpg" alt=""></div>
<div class="horizontal"><img src="img/p7.jpeg" alt=""></div>
<div><img src="img/p8.jpeg" alt=""></div>
<div class="vertical"><img src="img/p9.jpeg" alt=""></div>
</div>
</body>
</html>
мои коды такие же, как у парней в видео, на самом деле все было легко, как могло быть, пока я не попал сюда.вот ссылка на видео-- https://www.youtube.com/watch?v=t6CBKf8K_Ac&t=1952s. Я нахожусь в 29:55
] 2 ] 2