Šta radi svojstvo overflow u CSS i u kojim slučajevima ga treba koristiti?

Svojstvo overflow u CSS-u određuje kako da se rukuje sadržajem koji izlazi izvan granica elementa.

• visible: Sadržaj se prikazuje u potpunosti, čak i ako izlazi izvan kontejnera.
• hidden: Sadržaj koji izlazi izvan kontejnera se iseče i nije vidljiv.
• scroll: Uvek se prikazuju trake za pomeranje (horizontalno i vertikalno), čak i ako sadržaj ne izlazi.
• auto: Trake za pomeranje se pojavljuju samo ako je to potrebno (kada sadržaj izlazi).

Koristi se:

• Kada sadržaj elementa (npr. tekst ili slika) može biti veći od postavljenih dimenzija i potrebno je upravljati njegovim prikazom.
• Za kreiranje oblasti za pomeranje unutar stranice, na primer, za liste, blokove koda ili tabele.
• Za sečenje neželjenog sadržaja koji izlazi izvan elementa, kako bi se sačuvao originalni raspored.

Primer korišćenja overflow: auto; za blok sa ograničenom visinom:

.scrollable-block {
  height: 200px; /* Ograničavamo visinu bloka */
  overflow: auto; /* Dodajemo trake za pomeranje ako je sadržaj veći */
  border: 1px solid #ccc; /* Dodajemo ivicu radi preglednosti */
  padding: 10px; /* Unutrašnji razmak */
}