Svelte Material UI

Layout Grid

Try resizing your window to see the cells adapt to the new size.

npm i -D @smui/layout-grid
Cell 1
Cell 2
Cell 3
Cell 4
Cell 5
Cell 6
Cell 7
Cell 8
Cell 9
Span
Span 6
Span 6
Span 3
Span 3
Span 3
Span 3
Span 2
Span 2
Span 2
Span 2
Span 2
Span 2
Span 1
Span 1
Span 1
Span 1
Span 1
Span 1
Span 1
Span 1
Span 1
Span 1
Span 1
Span 1
Span 7
Span 5
Span 6 on desktop, 4 on tablet, 2 on phone (always half)
Order
Cell 1
Cell 2
Cell 3
Cell 4
Cell 5
Cell 6
Cell 7
Cell 8
Cell 9
Fixed Column Width
Cell 1
Cell 2
Cell 3
Cell 4
Cell 5
Cell 6
Cell 7
Cell 8
Cell 9
Align
Tall Cell
Align Top
Align Middle
Align Bottom
Nested
Cell 1, 1
Cell 1, 2
Cell 1, 3
Cell 2, 1
Cell 2, 2
Cell 2, 3
Cell 3, 1
Cell 3, 2
Cell 3, 3
Cell 4, 1
Cell 4, 2
Cell 4, 3
Cell 5, 1
Cell 5, 2
Cell 5, 3
Cell 6, 1
Cell 6, 2
Cell 6, 3
Cell 7, 1
Cell 7, 2
Cell 7, 3
Cell 8, 1
Cell 8, 2
Cell 8, 3
Cell 9, 1
Cell 9, 2
Cell 9, 3