Grid Övningar

Övning 1: Enkel 2x2 Grid

display: grid;

grid-template-columns: 1fr 1fr;

gap: 10px;

Box 4

Övning 2: 3x3 Grid med olika storlekar

Big Box

Box 2

Box 3

Box 4

Box 5

Box 6

Box 7

Övning 3: Asymmetrisk Layout

Stor Feature

Box 2

Box 3

Box 4

Box 5

Box 6

Box 7

Övning 4: Grid med Namngivna Områden

Header

Sidebar

Main Content

Footer

Övning 5: Grid med Namngivna Områden DEL 2

Header

Main Content

Menu 1

Menu 2

Menu 3

Info 1

Info 2

Info 3

Info 4