Grid

Layout includes flexbox-based responsive grid system with 12 columns. You can specify the width of each column by adding attribute col=<1-12>

<script>
    import {Button, Col, Grid} from 'svelte-spectre'
</script>

<Grid stack>
    <Col col="5"><div class="bg-secondary p-1">col-5</div></Col>
    <Col col="7"><div class="bg-primary p-1">col-7</div></Col>
    <Col col="8"><div class="bg-secondary p-1">col-8</div></Col>
    <Col col="4"><div class="bg-primary p-1">col-4</div></Col>
</Grid>
col-5
col-7
col-8
col-4
col
© 2022 — 2023 BASF SE

API Grid

gapless: Boolean
Provide gapless component
true | false
oneline: Boolean
Provide oneline component
true | false
stack: Boolean
Provide stacked component
 true | false
align: Align
component position
 start | center | end | stretch | ""
justify: Justify
component position
 start | center | end | stretch | ""