У меня знакомый спрашивает по поводу сайта, а я сам могу помочь только с C++, web я знаю только вскользь.
Он пишет:
"Делаем сайт с нуля. Нужно сделать вкладку с подкастами, я как бы сделал. А вот медиа материалы через вложения выходит не то, решил через код, это html, через нейросеть сделал, все залил. Но проблема в том, что вместо 13 роликов у меня только 6, что только не менял, ничего не выходит."
Далее пишет бот:
"Извините за неудобства. Давайте попробуем использовать другой подход для создания сетки с 13 видеороликами, чтобы убедиться, что все видео отображаются корректно."
"Попробуем использовать CSS Grid вместо Flexbox для создания сетки. Это позволит нам более точно контролировать размещение видеороликов."
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Видео Галерея</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.video-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 10px;
max-width: 1280px;
margin: 20px auto;
}
.video-container iframe {
width: 100%;
height: auto;
}
</style>
</head>
<body>
<h1>Видео Галерея</h1>
<div class="video-grid">
<div class="video-container">
<iframe src="https://www.example.com/video1" frameborder="0" allowfullscreen></iframe>
</div>
<div class="video-container">
<iframe src="https://www.example.com/video2" frameborder="0" allowfullscreen></iframe>
</div>
<div class="video-container">
<iframe src="https://www.example.com/video3" frameborder="0" allowfullscreen></iframe>
</div>
<div class="video-container">
<iframe src="https://www.example.com/video4" frameborder="0" allowfullscreen></iframe>
</div>
<div class="video-container">
<iframe src="https://www.example.com/video5" frameborder="0" allowfullscreen></iframe>
</div>
<div class="video-container">
<iframe src="https://www.example.com/video6" frameborder="0" allowfullscreen></iframe>
</div>
<div class="video-container">
<iframe src="https://www.example.com/video7" frameborder="0" allowfullscreen></iframe>
</div>
<div class="video-container">
<iframe src="https://www.example.com/video8" frameborder="0" allowfullscreen></iframe>
</div>
<div class="video-container">
<iframe src="https://www.example.com/video9" frameborder="0" allowfullscreen></iframe>
</div>
<div class="video-container">
<iframe src="https://www.example.com/video10" frameborder="0" allowfullscreen></iframe>
</div>
<div class="video-container">
<iframe src="https://www.example.com/video11" frameborder="0" allowfullscreen></iframe>
</div>
<div class="video-container">
<iframe src="https://www.example.com/video12" frameborder="0" allowfullscreen></iframe>
</div>
<div class="video-container">
<iframe src="https://www.example.com/video13" frameborder="0" allowfullscreen></iframe>
</div>
</div>
</body>
</html>
Снова бот пишет:
"В этом коде используется CSS Grid для создания сетки, в которой каждое видео занимает одну из четырех колонок. Сетка автоматически регулирует размещение видеороликов, чтобы они равномерно распределялись по строкам."
"Если это по-прежнему не решает проблему, возможно, проблема связана с самими ссылками на видео. Убедись, что ссылки на видео корректны и доступны для встраивания."
И знакомый сам пишет:
"Может из-за веса, может еще в чем дело. Каждый весит по 150 мб, итого 1 гб с копейкой, может из-за этого, я не знаю." - это он про видео файлы.
Так вот. Может какое-нибудь свойство изменить или добавить, чтобы отображалось правильно. Например было отображение только стольких элементов, сколько влезает в окно. И это поменять.
Простой
