/*<!--section:docs-->

`.columns` automatically creates columns with at least 30 characters each:

<article class="columns">
  <p>1</p><p>2</p><p>3</p><p>4</p><p>5</p><p>6</p>
</article>

The smaller the font size, the more columns will be created:

<article class="columns" style="font-size: 65%">
  <p>1</p><p>2</p><p>3</p><p>4</p><p>5</p><p>6</p><p>7</p><p>8</p><p>9</p>
</article>

Useful for tables of contents and long lists.

<!--section:code-->
```css */
.columns {
  columns: 25ch auto; /* common container 65ch / 25ch => 2 columns max, with a buffer for list paddings */

  /* Avoid breaking inside elements, such as nested lists */
  > * {
    break-inside: avoid;
  }
}