DEV Community

Michael Caveney
Michael Caveney

Posted on

What Default CSS Styles Do You Apply To Every Project?

Something that I think about and work on a lot is writing better CSS. Trial and error and reading have led me to adopting practices like declaring box-sizing: border-box on sites
to simplify any box-model related code I write, or setting the height and width on pages to 100vw/vh to ensure a concrete value that scales with device width. But I'm curious what the DEV community has to say about this: what are the most integral CSS properties that you add to every project?

Top comments (3)

Collapse
 
chrishall78 profile image
Christopher Hall

Setting max-width to 100% on images is good, it helps make websites responsive.

Also setting some default transitions on common elements can be useful. I like to set a transition for color, background-color and border on links, buttons, submit buttons.

Using something like normalize.css is good too. (github.com/necolas/normalize.css)

Collapse
 
dylanesque profile image
Michael Caveney

These are smart changes I definitely did not think about before! I've wondered about normalize as of late; I write in Gatsby a lot, and I've noticed their default
styles have gotten a lot more comprehensive, like they're added their own version of normalize. But even before that, it seemed like I didn't run into any odd cross-browser behavior on sites I was working on. I suppose it also matters how far back you need to go in terms of compatibility?

Collapse
 
dechamp profile image
DeChamp
  • { margin: 0; padding: 0 }