{:after + display: table} Что и как.

Всем доброго дня или ночи! Пожалуйста, объясните зачем используется вот такая запись? Если есть сслыка, где можно об этом почитать буду благодарен.

selector:after {
  content: '';
  clear: both;
  display: table;

}

Псевдораспорка. Когда в родителе все элементы зафлоачены, родитель их не видит. Распорка же добавляет элемент в конец родителя, который (с помощью свойства clear: both) видит эти элементы, не давая родителю схлопнуться.

Просто распорка: https://htmlacademy.ru/courses/65/run/15
Псевдораспорка: https://htmlacademy.ru/courses/65/run/16

А насчет display: table (поправьте, если не прав)…из-за его свойства ужиматься под содержимое, которого нет, то есть все будет работать так, как будто ничего и не добавляли.

1 лайк