Author: | jgthms |
---|---|
Views Total: | 91 views |
Official Page: | Go to website |
Last Update: | August 2, 2023 |
License: | MIT |
Preview:

Description:
A super-tiny CSS reset that ensures a consistent look and feel across various browsers and devices, which allows you to focus on crafting your unique design.
Features:
- Reset font sizes for semantic markup: You can use HTML headings and strong text without unintended sizing differences.
- Reset block margins: Removes default browser margins from sections, articles, aside, and other block elements. Add margins as needed in your CSS.
- Reset tables: Tables will only take up the necessary space for their content. No excess spacing.
- Preserve inline paddings: Keeps default paddings on buttons, inputs, and other inline elements for usability.
- Set border-box box-sizing: This allows you to add padding and borders without affecting an element’s total width. Simplifies CSS.
- Set responsive media elements: Images, videos, iframes, and other media will scale proportionally with the width of their container. Enables a fluid, responsive experience.
How to use it:
1. Install & download.
# NPM $ npm i minireset.css
2. Import the minireset.css. Available formats: Choose between .css
, .min.css
, .sass
or .css.lit.js
formats depending on your project needs.
<link rel="stylesheet" href="minireset.min.css" />
Changelog:
v0.6.0 (08/02/2023)
- remove height from html/body
- remove .not-visually-hidden class
- remove –focus-color variable and increase outline-width
- make links inherit color
- add scroll-margin for focused elements