Getting WordPress Lists to Span Columns Automatically

Working on a client project recently and managed to get this working – its a simple solution but effective.

Add the following CSS to your stylesheet. I use WPCodebox because it’s incredible but you can simply add to the customiser in WordPress.

/* making list span 2 columns in GB */
ul.\32 -col {
   column-count: 2;
}

@media (max-width: 768px) {
  ul.\32 -col {
   column-count: 1;
}
}

In your post, add a class to the list level element. I added ‘2-col’.

You can change this to suit your needs by adjusting the column-count property in the CSS, but that’s it!

I hope you find this useful.