От автора: когда вы применяете свойство CSS к элементу, происходит множество вещей, невидимых на первый взгляд.

Продолжить чтение →

От автора: на днях у меня было уникальное задание: создать макет с элементами на всю ширину, при этом один элемент должен оставаться наверху. Это оказалось довольно сложно осуществить, поэтому я документирую данный случай, если кому-то понадобится воссоздать тот же эффект. Часть хитрости была связана с логическим позиционированием на маленьких экранах.

Продолжить чтение →

От автора: создание содержимого страницы, которое «прилипает» к области просмотра при прокрутке, что-то вроде меню перехода к привязке или заголовков разделов, никогда не было таким простым. Добавьте position: sticky в набор правил CSS, установите смещение направления (например top: 0), и вы готовы произвести впечатление на своих товарищей по команде с минимальными усилиями.

Продолжить чтение →

От автора: существует множество учебных пособий и руководств, которые обучают CSS-grid в целом, и я писал об этом несколько раз. Однако я заметил, что существует неправильное понимание функции minmax(), поскольку большинство статей являются общими или не содержат достаточного объяснения и реальных примеров использования. minmax() очень мощный и полезный инструмент.

Продолжить чтение →

От автора: я консультант по доступности. Я решаю проблемы. Одна из самых распространенных проблем с веб-сайтами, которые меня просили исправить — это сломанные, деформированные, неполные недоступные формы. Есть несколько вещей, на которые прокуроры или адвокаты истцов с ограниченными возможностями обращают особое внимание, потому что пользователи с ограниченными возможностями не могут использовать по какой-либо причине.

Продолжить чтение →

От автора: на прошлой неделе мне представилась возможность поработать над побочным проектом, который не планируется включать в матрицу поддержки Internet Explorer 11, и это вызвало у меня только положительные эмоции! Это открывает дверь к большому количеству забавного CSS, под названием «Специальные возможности».

Продолжить чтение →

От автора: термин «Адаптивная верстка» часто подразумевает под собой проверку браузера в области просмотра на разной ширине и различных по размерам устройств. Мы всегда тестируем браузер по горизонтали, уменьшая ширину, но я редко встречал какие-либо соображения по поводу тестирования по вертикали за счет уменьшения высоты окна браузера. В глубине души возникает вопрос: нужно ли нам уменьшать высоту окна браузера? Да, и я постараюсь убедить вас в этой статье.

Продолжить чтение →

От автора: вы можете использовать селектор :focus-within для стилизации родителя выделенного фокусом элемента.

Продолжить чтение →

От автора: каскадные таблицы стилей или CSS, как их обычно называют, составляют основу современной сети. Как HTML отвечает за структуру, а JavaScript — за интерактивные функции, CSS обрабатывает все стили, делая веб-сайт таким великолепным, как он есть.

Продолжить чтение →

От автора: поддержка CSS Grid (CSS сетки) в современных браузерах открыла новые возможности компоновки элементов. Мы можем создавать более сложные дизайны, используя меньше элементов, чем мы могли, используя компонент Flexbox. Но когда вы думаете о CSS Grid, вы в основном думаете о блочном макете, ведь так?

Продолжить чтение →