The firehose effect is in full flow in Kevin Geary’s latest episode, and this time, it concerns using CSS Grid inside Bricks. The latest video in the ACSS 101 series introduces the grid layout capabilities of Automatic CSS. Kevin demonstrates the power of utility classes, how to use BEM, and the need to occassionally use custom CSS.

Utility Classes

In the first part of the video, Kevin demonstrates the power of Automatic CSS’s utility class capabilities. Honestly, if he had stopped there, it would have been a valuable lesson in some of the hidden features of ACSS — who knew pressing the command (alt) key would give you responsive options? While this is a very powerful feature and appropriate in some instances when in doubt, BEM it out.

Using BEM

Kevin then talks about building out scalable and maintainable features (his mantra for website building in general) and the need to use the block, element, modifier approach, or BEM, when creating the layouts. While ACSS does a great job of helping you apply BEM classes to everything, it requires you to build out all your base elements ahead of time, apply the BEM classes, and then start designing. It is a brilliant approach, but I much prefer the Advanced Themer functionality that allows me to create my design — breaking all the rules along the way — and then use the style converter to take all of the styles from the IDs and move them into BEM classes. Ultimately, it is the same, but I tend to design first and class later, unless I know exactly what is needed.

Custom CSS

This part of the video was concise but very important. It highlighted why you really need to know CSS to overcome any design challenges. Kevin’s demonstration of programmatically changing the first element in a loop was basic but powerful, further emphasizing the need for a modern builder. Before anybody grumbles, it is possible to write CSS and apply it in any theme or builder. Still, the speed at which you can do it in a builder like Bricks without manipulating some unseen structure should make it apparent that it’s Bricks for the win.