When searching for the best CSS practices in 2023, the CSS reset function often appears in the results. Basically, this involves including a stylesheet in your website that resets the default styles of different browsers. This ensures a consistent presentation of the website across all browsers. There are two types of CSS resets:
Hard Resets: They remove all default styles applied by browsers. For example:
* {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
box-sizing: border-box;
}
/* Optional: Additional resets for specific elements */
body, figure {
margin: 0;
}
/* Remove list styling */
ul, ol {
list-style: none;
}
In this example:
*: targets all elements, margin, padding, border – set the properties to zero •
font: Preserves the default font styles.
vertical-align: Aligns elements to the baseline.
box-sizing: Includes padding and border in the element's total width and height.
Soft Resets: They do not completely remove the styles in all browsers, but instead attempt to standardize them and make them consistent. The most popular soft reset is normalize.css. It can be downloaded from this page http://necolas.github.io/normalize.css/. Normalize.css fixes cross-browser inconsistencies while preserving useful default styles. The normalize.css file can either be linked locally or via a CDN in the head, or the code can simply be inserted at the beginning of the stylesheet. CSS resets are still widely used and recommended as a good practice, but they are no longer needed as frequently as they were 10 years ago. Today, the latest versions of the most popular browsers are more consistent than they used to be and have fewer differences in how websites are displayed.
Our Internet Agency Munich, Econcess, places great importance on an engaging design that appeals to a wide range of customers. If you are interested in a website for your company, please feel free to contact us. We specialize in customized solutions and offer professional support in the implementation of your digital projects.
