Использование flex для центрирования в CSS - это, пожалуй, самый правильный вариант сегодня.

.gentle-flex {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1ch;
}

Но это далеко не единственный вариант.

Давайте представим, что вам необходимо выровнять по горизонтали несколько inline-* элементов. text-align: center; сделает это буквально в одну строку.

See the Pen Centering Inline Elements by Chris Coyier (@chriscoyier) on CodePen.

А что, если вам надо отцентрировать эти же элементы относительно родительского элемента? Это легко сделать с помощью width: fit-content для родительского контейнера.

See the Pen Centering Unknown Width Parent by Chris Coyier (@chriscoyier) on CodePen.

В наш век технического прогресса нет ничего удивительного в том, что многие ценные и важные знания можно найти в свободном доступе. Касается это и знаний в такой области, как программирование, которое ныне становится всё более популярной деятельностью на рынке труда. Стать программистом можно, не имея при этом большой суммы денег в кармане.

Visual Studio Code — один из самых популярных редакторов кода. Многие разработчики предпочитают его, так как он удобен в использовании и содержит множество полезных расширений, с помощью которых легко оптимизировать работу.

Полезные плагины помогают допускать меньше ошибок при написании кода, да и значительно сокращают время работы. Чтобы установить расширения, необходимо перейти во вкладку «Extensions» и с помощью поиска найти нужный плагин.

Новые MacBook-и (и Mac Mini) на процессорах Apple M1 появились в продаже. Устройства показывают потрясующую скорость и время работы от батареи, будучи относительно дешевыми. Многие обзорщики советуют эти компьютеры к покупки для повседневных задач. Но ситуация немного меняется, если говорить о разработчиках программ.

В этой лекции поговорим о парадигме объектно-ориентированного программирования (ООП) применительно к JavaScript. Как создавать классы/объекты и наследоваться от них.

Это десятая лекция моих курсов для будущих веб-разработчиков. Остальные лекции, а также мои блоги (влоги) можно найти у меня на канале.

Репозиторий с презентациями и домашними заданиями

В этой лекции поговорим о парадигме функционального программирования приминительно к JavaScript. Но конкретно рассмотрим только читые функции, функции высшего порядка и рекурсию.

Это девятая лекция моих курсов для будущих веб-разработчиков. Остальные лекции, а также мои блоги (влоги) можно найти у меня на канале.

Репозиторий с презентациями и домашними заданиями

Ответ на часто задаваемый вопрос.

«Ленивая загрузка изображений» – это практика, которая популярна уже около десятилетия, и на то есть веская причина: изображения, как правило, – самая тяжелая часть страницы, и возможность не отображать картинки, которые не видны на экране значительно ускоряет загрузку страницы. Есть плагины для ленивой загрузки изображений практически для каждого JavaScript-фреймворка, или же можно использовать Intersection Observer API. Сейчас такой функционал стал очень востребован и разработчики Chrome добавили встроенную поддержку lazy loading в браузер.

Сделать чекбоксы input[type="checkbox"] и радиокнопки input[type="radio"] красивыми – задача не сложная. Однако, чаще всего, за этим следует добавление новых элементов, а следовательно и усложнение DOM-структуры документа.

Для современных мобильных браузеров, а также декстопных браузеров на основе WebKit и Blink (Chrome, Opera, Vivaldi и т.д.), для некоторых типов инпутов можо создавать псевдо-элементы after и before.