Flexbox
FLEXBOX - CSS tehnika za raspoređivanje i poravnavanje elemenata unutar kontejnera. Omogućava fleksibilno i dinamično prilagođavanje elemenata bez potrebe za korištenjem float ili positioning svojstava.
Glavne Karakteristike Flexboxa
- Osnovna podjela: Sastoji se od flex container (roditelj) i flex items (djeca).
- Os glavne i poprečne osi:
- Main axis (glavna os) – određena svojstvom flex-direction (npr. red ili stupac).
- Cross axis (poprečna os) – okomita na glavnu os.
- Jednostavno poravnanje elemenata koristeći justify-content, align-items i align-self.
- Mogućnost mijenjanja veličine elemenata pomoću flex-grow, flex-shrink i flex-basis.
Svrha Flexboxa
- Omogućava kontejneru da mijenja dimenzije i raspored svojih elemenata.
- Dopušta elementima da ispune dostupan prostor unutar kontejnera.
- Prilagođava se različitim veličinama ekrana i uređaja.
Funkcionalnost Flexboxa
- Elementi se prilagođavaju tako da ispune sav dostupan prostor.
- Elementi se smanjuju kako bi ostali unutar definiranih granica.
Primjeri koda
HTML
CSS
REZULTAT
