CSS - Grid vs Flex

Aus Wikizone
Version vom 7. August 2018, 21:01 Uhr von 37.49.33.174 (Diskussion) (Die Seite wurde neu angelegt: „ https://www.youtube.com/watch?v=sB-ooIXFTjg == Grid == Hier geht es eher um das Anordnen von Bereichen im Verhältnis zueinander. Grundlegendes Layout (Footer…“)
(Unterschied) ← Nächstältere Version | Aktuelle Version (Unterschied) | Nächstjüngere Version → (Unterschied)
Wechseln zu: Navigation, Suche
https://www.youtube.com/watch?v=sB-ooIXFTjg

Grid

Hier geht es eher um das Anordnen von Bereichen im Verhältnis zueinander. Grundlegendes Layout (Footer, Sidebar...)

  • display: gridÜbergeordnetes Grid Container
  • grid-template-wors
  • grid-template-columns
  • grid-gap
  • grid-template-areas

Vorteile

Große Bereiche Positionieren auch vertikal zentriert etc. immer dann wenn der Browser viel übernehmen soll. Positionieren innerhalb der Grid Bereiche

Flex

Beispiel 

display: flex
justify-content: space-between
align-items: center

Styling von kleineren Bereichen z.b. Navigation

Abgerufen von „https://wiki.stephanschlegel.de/index.php?title=CSS_-_Grid_vs_Flex&oldid=23240“