Всем привет Как перевести строку как на картинке какой код прописать html <div class="box"><img class="img" src="3.jpg" alt=""><b>Квадратная вафельница DOMOTEC MS-7705</div><div class="box"><img class="img" src="4.jpg" alt=""><b>Квадратная вафельница DOMOTEC MS-7705</div>Див css .box {background-color: #b3aa99;padding: 20px;margin: 10px;width: 150px;height: 200px;}

Изображение

------
1041_IMG_20251227_121802.jpg (251.7 Кб)
Скачиваний: 44

Andr11 , <div class="flex"><div class="box"><img class="img" src="3.jpg" alt=""><b>Квадратная вафельница DOMOTEC MS-7705</div><div class="box"><img class="img" src="4.jpg" alt=""><b>Квадратная вафельница DOMOTEC MS-7705</div></div>
Див css .box {background-color: #b3aa99;padding: 20px;margin: 10px;width: 150px;height: 200px;}
.flex {display: flex;}

Работает

Andr11 , <div class="boxs"><div class="box"><img class="img" src="3.jpg" alt=""><b>Квадратная вафельница DOMOTEC MS-7705</div><div class="box"><img class="img" src="4.jpg" alt=""><b>Квадратная вафельница DOMOTEC MS-7705</div></div>
Див css .box {background-color: #b3aa99;padding: 20px;margin: 10px;width: 150px;height: 200px;}

.boxs {display: grid;
grid-template-columns: repeat(2, 1fr);}

Andr11 , Полезные ссылки:
https://css-tricks.com/snippets/css/a-guide-to-fle... - Шпаргалка по CSS flex
https://www.youtube.com/watch?v=yK7WEt-CdhI - Реальная верстка на Flexbox из макета PSD
https://youtu.be/hrFPD0nkRVA?si=mHKHrKaI0x8_eQ2P - Дмитрий Лаврик (Flexbox - основы технологии и идеи удобной вёрстки по сетке)
https://youtu.be/m16v1KkZoi8?si=qEqykrrV3O1sSHpQ - Float, inline-block, flex, grid layout
https://youtu.be/s6RCsjcQADc?si=h17Ee2GAX8BeMqx4 - CSS Grid Layout vs Flexbox

https://youtu.be/6l3ZSOQKE5g?si=dnlK3TGFZ7MW78SE - Верстка HTML + CSS (Для новичков, что бы понять основы html и css)

Поддерживаю быстро накидал