The contents of a pane can prevent a pane from being shrunk

[Autre31415]

When creating split panes that include a variety of content I find that certain elements/text will block you from shrinking a pane all the way. A simple example of that can be found in this commonly linked to fiddle where you cannot shrink any pane to a size smaller than the text it contains.

If you absolutely position each element inside of a pane you won't be blocked from shrinking, but this can be untenable depending on the content being used.

[thegoleffect]

For anyone affected by this, you can fix this by applying this css to the element divs:

&>div { min-width: 0; overflow: hidden; }

This is because css grid changes the default min-width of elements from 0 to auto which will prevent the panes from disappearing when content exists. It also sets overflow to visible so you'd need to change that as well.