DEV Community

Discussion on: How do you tackle CSS rendering differences?

Collapse
 
merri profile image
Vesa Piittinen • Edited

With bigger projects I greatly prefer Normalize. For smaller projects I "normalize" as needed.

I've never liked resets as they often feel like they force you to do more work with some basic stuff such as setting up how regular content should be styled which is where I find defaults to work just fine. In general this how I think about normalizing: with normalize you define the main content styles and all the other styles are the exceptions for UI components.

In the other kind of viewpoint global resets are also the lazy way to go: instead of learning where you need to override the defaults you instead avoid learning the stuff you should know as a web dev. Such as what styles list elements have by default so you can know how to deal with them if you need to.

Related to resets (in my opinion) is also the "avoid semantic elements" mindset. In that case you see devs using mostly just divs and spans, maybe some other elements with no default styles such as header and main. This is like resets but you re-implement the web and end up using tons of ARIA attributes to redo native functionality like buttons or lists. This results into some good native features missing. Great example of this: Twitter and middle clicks not working to open a tweet into a new tab. Their use of semantic HTML is minimal. On initial page you have about 1000 divs, 200 spans, 80 svgs, 60 links, 8 articles, 5 h2 elements, 3 h1 elements, 0 buttons, 0 lists of any type, 0 h3 - h6 elements, 0 sections...

One of the things that might interest me in the future is the use of custom CSS properties, because you could use them to define context based normalization via simple utility classes for example. And I think this would happen without specificity issues. Haven't had much time to work with CSS stuff in the recent years but I guess that'll change soon :)

As for actual differences between browsers... well, these days the issues are kinda minimal. The worst special kid around is iOS Safari. And IE11 if you still support it, but it is becoming rather dead by now.

Collapse
 
madza profile image
Madza

Thanks for your insight, Vesa :)