skip to main content

On CSS

"pixel perfect" is dumb. Web pages are stretchy. Use min and max, and let the browser work it out.

Margins collapse. Padding adds.

Container queries are swag af. They allow you to tune layouts more finely than before.

Get feedback as fast as possible, so you can fix it before things are built on top of it. I like to build things directly in the browser so I can immediately see where ideas don't work. (Especially fancy layering things, like the header of this site.)

Tailwind Specific

It's fast to play with designs, and you know you aren't fucking up the rest of the site by changing global CSS. Just doing combinations of static utility classes.

Tailwind sets useful media queries.

Design all layouts from smallest screen to biggest screen.

Build everything in one page and then abstract into components once the patterns become obvious.

Use margin for fine-tuning specific content, like text or logos. First use gap, space-x, etc.

@apply to use Tailwind classes in .css files.

New coloured shadows are cool.