@bit24yes
CEO

Как растянуть изображения на всю ширину в мобильной версии сайта?

Здравствуйте.
Для того чтобы изображения растягивалось на всю ширину страницы, я использовал такой код:

<style>
@media only screen and (min-width : 320px) and (max-width : 480px) {
 img {width: 100%;}
}
</style>


Вставлял его напрямую в пост страницы (WordPress), для тех страниц, где были изображения в теле статьи.

Но позже, обнаружил, что на некоторых страницах, он срабатывает некорректно.
Пример, скрин - https://clip2net.com/s/3W0XpQp

Страница с проблемой тут - https://goo.gl/5EyGG6

Как можно устранить проблему?
  • Вопрос задан
  • 421 просмотр
Решения вопроса 1
Leo5878
@Leo5878
Улыбчивай, люблю учить и учиться
У тебя на родителе в figure стоит класс align: left. Из-за чего у тебя происходит обтекание слева от картинки
@media only screen and (min-width : 320px) and (max-width : 480px) {
 img {width: 100%;}
 .alignleft {
    float: none;
 }
}
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
snap44
@snap44
Фыр!
Для figure#attachment_70 ширину 100%. У вас 300px указано, картинка и растягивается максимум на 300px
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы