skip to main content

On CSS

I have *opinions*.

Published 2022/02/21

Updated 2024/09/20


Table of Contents


    In General

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

    Margins collapse. Padding adds.

    Design layouts from smallest screen to biggest screen.

    Get feedback as fast as possible, so you can fix bugs 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

    It's fast to play with designs, and you know you aren't messing up the rest of the site by changing global CSS, because it is just combinations of isolated utility classes.

    Tailwind has useful media queries.

    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.

    Coloured shadows: they are pretty cool.