Prevent break column within a ul/ol element using CSS columns

When we use CSS columns: n on a ul or ol element sometimes we need to prevent splitting an element between two columns.

For example we want the second title below to be above it's items on the second column

After applying the break-inside: avoid-column CSS rule the result will be like this:

CSS attribute: break-inside
Available values: auto | avoid | avoid-page | avoid-column | avoid-region
Initial: auto