Default pane size

Provide dimension of your panes when they first load (will be used for the width or height respectively for the vertical or horizontal layout).
If you provide a default size, make sure you provide it for all the panes for a total equals to 100%. If a pane is missing a default size, then all the panes will have the same size.
Note that setting a default value is different than setting a min or max value.

1

Default size of 65%

2

Default size of 10%

3

Default size of 25%

<script>
  import { Pane, Splitpanes } from 'svelte-splitpanes';
</script>

<Splitpanes horizontal style="height: 400px">
  <Pane size={65}>
    <span>1</span>
    <p>Default size of 65%</p>
  </Pane>
  <Pane size={10}>
    <span>2</span>
    <p>Default size of 10%</p>
  </Pane>
  <Pane size={25}>
    <span>3</span>
    <p>Default size of 25%</p>
  </Pane>
</Splitpanes>
previous
next