svelte-tabs
svelte-tabs copied to clipboard
Changing margin shifts following content
Any content after Tabs
will be shifted upward by .5em when the last Tab is selected.
This is due to this CSS rule:
.svelte-tabs__tab-panel { margin-top: 0.5em; }
Putting the margin on the TabList
instead fixes the problem.
.svelte-tabs__tab-list { margin-bottom: .5em; }
Another option for removing the unwanted spacing would be to move the {#if $selectedPanel === panel}
block to go around the entire div in the TabPanel component as opposed to just the slot.
Another option for removing the unwanted spacing would be to move the
{#if $selectedPanel === panel}
block to go around the entire div in the TabPanel component as opposed to just the slot.
This is a perfect solution, since we can now apply any style rules we want to the panels with no 'stacking' consequences at all.
It seems like this repo is not maintained however...