EASY Text Columns Without Flex or Grid (PLUS Utility Classes vs Custom Classes Best Practices)

Have you ever wanted to break text or lists into columns without losing automatic content flow between columns?

In this tutorial, I'll show you how to break text content into columns WITHOUT Flexbox or GRID.

BUT WAIT! THERE'S MORE!

Because this technique is actually so simple and easy, I want to spend some extra time and attention on a few things.

I'm gonna go slow and make sure you grasp some key concepts related to best practices, workflow, style organization, future-proofing, etc.

For those of you who are new or beginner-level at CSS, I'll take my time writing the code and explain each step.

And I'll throw in whatever other tricks and value bombs I can think of.

Spend the hour with me and you'll learn a lot more than the title of the training.

And if you want even more, you're welcome to join me and over 800 developers, designers, freelancers, and agency owners in my Inner Circle: https://digitalambition.co/inner-circle/

Interested in Automatic.css? Check out https://automaticcss.com

0:00 Intro
01:10 Page Overview
02:50 IDs VS Classes VS Utility Classes
06:40 BEM & Custom Class Naming
13:05 Where to Put Custom Styling
14:23 Splitting a List Into 2 Columns
17:32 How to Inspect Styling Issues
23:51 Automatic Responsiveness
26:09 Adaptive Behavior
26:58 Easily Styling Markers
29:38 Custom CSS Scalability Example
32:12 Creating Utility Classes
46:51 Creating Ruled Columns
53:38 Final Thoughts