Почему пропадает background?

Question

[Username]

Добрый день, при добавления стилей к списку, то задний фон пропадает, в чём может быть дело?
И при применении position: absolute к дочернему элементу, то это значение устанавливается и родителю, даже если родителю задать position: static, с чем это связанно?
https://jsfiddle.net/6fx4jgLt/

Comments

[Михаил]

у вас li с float, весь ul выпадает из контекста и card не имеет высоты, можно например прописать ему overflow: hidden; и вы увидите бекграунд

[Андрей Федоров]

Михаил: Нифига себе. Почему overflow: hidden; работает можете объяснить?

Answer 1

[Андрей Федоров]

Потому что из-за float: left у .list-schedule li их размеры не влияют на card, поэтому он у вас нулевой высоты, т.о. его фон просто не видно.
https://jsfiddle.net/64amzksv/

Comments

[Username]

Точно прописал overflow: hidden и card стал зависеть от списка. А что такого сделало свойство overflow: hidden, чтобы card стал зависимым?

[Андрей Федоров]

Username: Я бы то же хотел знать, Михаил расскажет, если захочет.

Answer 2

[Minary]

Вы присвоили для li - float (при этом элементы обтекают его) и значит что у card(так как высота и ширина не задана) ширина и высота = 0
Допишите для класса card - такие стили :

.card::after {
  content: '';
  clear: both;
  display: table;
}