CSS resets help enforce style consistency across different browsers with a clean slate for styling elements. You can use a CSS reset library like Norm

AllThingsSmitty / css-protips

submited by
Style Pass
2021-07-23 13:00:07

CSS resets help enforce style consistency across different browsers with a clean slate for styling elements. You can use a CSS reset library like Normalize, et al., or you can use a more simplified reset approach:

You can specify all of an element's properties using the all shorthand. Setting the value to unset changes an element's properties to their initial values:

Sighted keyboard users rely on focus to determine where keyboard events go in the page. Make focus for form elements stand out and consistent then a browser's default implementation:

Want to center something else? Vertically, horizontally...anything, anytime, anywhere? CSS-Tricks has a nice write-up on doing all of that.

Note: This tip may not be ideal for accessibility, specifically screen readers. And copy/paste from the browser doesn't work with CSS-generated content. Proceed with caution.

SVG scales well for all resolution types and is supported in all browsers back to IE9. Ditch your .png, .jpg, or .gif-jif-whatev files.

Leave a Comment
Related Posts