Почему элементы секции залазят на другую?
Не могу понять почему секция features залазит на секцию screenshots? Может быть это из-за того что у каждой section задан отступ сверху и снизу по 120 пикселей, но в других секциях все нормально же отображается
Код jsfiddle.net/z6dhv4gr/ сайт c96180og.beget.tech
Ответы (1 шт):
Вот некоторые подсказки которые вам помогут найти баги в верстке:
1) Откройте вашу страницу в обычном браузере, нажмите правой кнопкой мыши и выберите "Просмотреть код" или "Инспектировать элемент"
У вас откроется справа окно разработчика, в режиме онлайн. Там нажимайте на DIV классы (class) или id которые у вас криво отображаются и вам откроется CSS строка кода которая за это отвечает. Таким образом вы можете убирать какие-то пункты или добавлять прямо в браузере друг за другом и смотреть что было сделано не так.
Это увеличит скорость поиска ошибки. Такой подход будет сразу вам показывать где вы пропустили пункты, более того большинство браузеров показывают сами сразу где и каких пунктов не хватает в CSS.
2) При анализе как выглядит ваша верстка на разных устройствах, используйте также специализированные сервисы для этого.
Простое изменение размера окна браузера на 100% вас подведет и не покажет реальной картины, так было у меня при отображении верстки на Iphone и других Ios устройствах.
Сайт: www.mobiletest.me на этом сайте реально происходит эмуляция устройств, а не как в остальных сервисах, псевдо-смена разрешений.
3) Использование онлайн валидаторов HTML CSS, в которые вы вбиваете ваш код и система автоматически анализирует его и указывает на ошибки.
Примеры сайтов: www.freeformatter.com
На самом деле их сотни, в поисковике найдете тот, который максимально удобен для вас.
4) Также поэкспериментируйте с разными средами разработки.
Писать код в обычном текстовом блокноте - это уровень про, но если вы новичок используйте для начала более продвинутые средства разработки наподобие PHP Storm, Code LObster и десятки других где вам сразу показываются ошибки.