Do Not Fight against the User-Agent Stylesheet

In the past, browsers used margin-top or margin-bottom instead of margin-block-start or margin-block-end to style HTML elements. Now, when the CSS logical properties get adopted by the browsers, that also automatically updates the user-agent stylesheet to use the latest CSS feature.

If you visit the first website on the internet, it still looks good. Its styling gets updated along with the browser's user-agent stylesheet.

But relying solely on the user-agent stylesheet is not good. That stylesheet does not limit the line length of all texts. The line spacing does not exist, which means it makes a block of text hard to read. By default, images use their real size and do not adapt to different screen sizes.

The user-agent stylesheet is not designed to make the website easy to read. But, at the same time, it already does something to achieve it. It makes the web responsive. It makes the web respect the user's settings. The flaws in it are not fatal to the point where the web is not usable.

You can add and fix all the flaws with your stylesheet. You can add a dark theme to make your website respond to the user's theme preference. You can make your website look similar across browsers.

But the flaws in your stylesheet can be fatal since the browser does not stop you from making mistakes. For example, a low color contrast makes texts on your website hard to read for everyone. Link text without an underline may not be recognized by your users. An input box without a box is weird. So be careful.

The point is that we should work on top of the user-agent stylesheet to make our websites better instead of fighting against it.