Jaké metody blokování (clearing) znáš a v jakých situacích se používají?

Metody zabránění obtékání:

• clear: left; — zakazuje obtékání zleva. Používá se, když prvek nem má být umístěn vedle floatujících se prvků vlevo.
• clear: right; — zakazuje obtékání zprava. Používá se, když prvek nemá být umístěn vedle floatujících se prvků vpravo.
• clear: both; — zakazuje obtékání z obou stran. Používá se, když prvek nemá být umístěn vedle žádných floatujících se prvků. Toto je nejčastější varianta.
• clear: none; (výchozí hodnota) — povoluje obtékání.

Použití:

• Pro zabránění "seskupení" rodičovského kontejneru: Pokud všechny děti rodiče floatují (mají float), rodičovský kontejner ztrácí výšku a seskupí se. Přidání prvku s clear: both; po floatujících prvcích uvnitř rodiče nebo použití pseudo-objektu ::after s clear: both; tento problém řeší.
• Pro správné umístění prvků po floatujících: Pokud se normální (ne floatující) prvky mají umístit pod floatující, nikoli vedle nich.
• Pro vytváření "řádků" nebo "sérií" v floatových rozvrženích: Když se prvky s float mají uspořádat do několika řádků, clear se používá k začátku nového řádku.

Příklad použití pseudo-objektu ::after pro čištění:

.clearfix::after {
  content: ""; /* Důležité pro zobrazení pseudo-objektu */
  display: table; /* Nebo block */
  clear: both; /* Hlavní vlastnost pro čištění */
}

Třída clearfix se pak aplikuje na rodičovský prvek obsahující floatující děti.