Как адаптировать страницу для маленьких экранов?

Question

[squirtazzer]

Здравствуйте, на 1920х1080 сайт выглядит хорошо, но на меньших размерах возникают ошибки(скрин ниже)

Comments

[Сергей Герасимов]

Попробуйте изображение поместить на фон или на определенной ширине текст помещать под изображением

[squirtazzer]

Сергей Герасимов, я вас понял)дело в том что этот блок из двух состоит-50 процентов КАРТИНКа(большая мода)и 50 блок залитый коричневым цветом и помещенный на нем текст с padding.
Но есть след блок https://motorr-dv.ru/side.html медиафасады.там сделано именно так как вы сказали-картинка фоном и на нем текст.но она тоже на экранах менее 1080 плывет.

[Сергей Герасимов]

squirtazzer, залейте блок с картинкой таким же фоном и выравнивайте картинку по высоте. Но будет смотреться не совсем лучше...

Ещё как вариант - сделать единым блоком и задать ширину картинки 50%, и обтекание текста...

А про фон, я имел ввиду пустой блок с вашим изображением на фоне, но там есть проблемы с высотой...

[squirtazzer]

Сергей Герасимов,то есть решения нет нормального

[squirtazzer]

а можно как нибудь посмотреть с каким разрешением экрана заходили на сайт?

Answer 1

[ink]

Не люблю бутстрап но всё же с такими вопросами сюда : https://webref.ru/layout/bootstrap

Comments

[squirtazzer]

Понимаю вас, но все же заказчик выбрал этот шаблон,вот и приходится мучатся вставляя его картинки и блоки.которые потом не влезают в экраны менее 1080

[ink]

squirtazzer, как это не влазиют ? делаем медиа запрос и говорим что : эй img стань блочным и выведи размер на 100% ширины а высоту оставь автоматически ,...
Ну и так же блоку и изображением необходимо сказать что он будет таким что бы изображение внутри подходило , собственно вопрос то не сложный ... но по скринам гадают не на тостер

[squirtazzer]

ink, https://motorr-dv.ru/side.html