Kokius srauto užblokavimo (clearing) metodus žinote ir kokiose situacijose jie taikomi?

overflow: hidden; arba overflow: auto;: Taikoma tėviniam elementui, turinčiam float. Sukuria naują bloko formatavimo kontekstą (BFC), leidžiantį tėvui įtraukti apgaubiančius elementus į savo aukštį.
Situacija: Paprasčiausias būdas, kai reikia paslėpti turinį, išeinantį už elemento ribų, arba taikyti slinkimą, bet taip pat veikia kaip valymo metodas.

clear: both;: Taikoma elementui, kuris neturi apgaubti ankstesnių float elementų. Šis elementas bus išdėstytas žemiau visų apgaubiančių elementų.
Situacija: Kai reikia sukurti naują eilutę arba sekciją po apgaubiančių elementų.

clearfix metodas (psevdoelementai ::after): Prideda psevdoelementą prie tėvinio konteinerio su tam tikromis savybėmis, imituodamas clear: both; elgesį, bet nereikalauja papildomų HTML elementų.

.clearfix::after {
    content: ""; /* Būtinas turinys psevdoelemento rodymui */
    display: table; /* Sukuria naują bloko kontekstą, kaip ir `overflow: hidden;` */
    clear: both; /* Taikoma valymas */
}

Situacija: Dažniausiai naudojamas ir rekomenduojamas valymo būdas, kuris yra švarus ir nepažeidžia struktūros. Taikomas tėviniam elementui, turinčiam apgaubiančius elementus.

Naudojant display: flex arba display: grid: Šiuolaikiniai maketavimo metodai, kurie nereikalauja apgaubimo, taip pašalinant valymo poreikį.
Situacija: Sudėtingų maketų kūrimas arba kai reikia lankstesnio elementų išdėstymo valdymo.

Papildomas elementas su clear: both; (senas metodas): įterpia tuščią HTML elementą po apgaubiančių elementų ir taiko jam clear: both;.
Situacija: Laikomas pasenęs ir nenorimas būdas, nes prideda perteklinį HTML.