Вы ошиблись статьей. Статья называется Touch slider на JavaScript. И эта реализация решает не ту же задачу, что описана в статье. Но вещь однозначно интересная и заслуживает внимания)
Спасибо за конструктивный отзыв. Я не утверждал, что контейнер родился в бутстрап. Буду дополнять статью решением возможных подводных камней, в том числе и блоков с абсолютным позиционированием по краям секции.
Попробуйте применить этот метод и отписывайтесь об обнаруженных проблемах. Если нужно сделать картинку внутри контента, то нужно будет задать background-size и background-position тоже относительными единицами, скорее всего с применением calc. В скором времени я дополню статью различными примерами с background. Хорошее замечание, спасибо за Ваш отзыв!
Хорошее замечание. Над этим надо подумать. Дизайн-макет обычно не предусматривает скроолбар, значит используя 100vw, мы тоже не учитываем его. Но какие именно единицы измерения использовать всё равно выбирать Вам.
Спасибо! Мне тоже нравится это. Если не любите стили для тегов, то можно сделать как Вы сказали — задать эти стили для класса .container, а его уже вешать на секции. Всё будет работать. Очевидных минусов я пока не обнаружил, но подводные камни исключать нельзя. Если я их обнаружу или обнаружит кто-то другой и напишет мне или в комментарии, то я дополню статью.
Смешать классы обёртки и контейнера — хороший вариант. Но не проще один раз в css задать стили и забыть? Не знал об этой книге. По содержанию понравилась. Почитаю. Спасибо!
Дробные пиксели взял у системы сеток bootstrap. Не вдавался в подробности почему именно дробные.
В Ваших словах слабо прослеживается логика. Повторюсь: нужно один раз в css задать для тега section padding'и с медиа-запросами и всё. И забыть о центрировании контента. Необходимые стили внутренней компоновки задавать уже для нужной секции по классу. Браузер сделал один расчёт calc() по текущему медиа-запросу и всё.
Метод может работать. Секция будет в центре с указанной шириной, но если нам нужно задать какой-то фон (что в 90% случаях и требуется), то сразу всё ломается. Я этот случай описал в самом начале статьи. А если задать в стилях padding для тега section, то о дополнительных классах, контейнерах и блоках можно забыть.
Как извращаться? Один раз прописали css правила для нужных тегов, например section, header, footer. И не создаём каждый раз лишние блоки, вроде контейнера или блока-обёртки для контента.
То есть создавать каждый раз в секции по 1-2 блока — это удобнее, чем один раз написать padding для тега section и копировать из проекта в проект? Серьезно?
Дробные пиксели взял у системы сеток bootstrap. Не вдавался в подробности почему именно дробные.