This is a simple CSS reset. It's not meant to be a full reset. It's just meant to get you started quickly.
npm install simple-resets
Simply include the following in your stylesheet
@import 'simple-resets';
Or use the @use
directive
@use 'simple-resets';
*,
*::after,
*::before {
box-sizing: border-box;
}
body {
line-height: 1.5;
-webkit-font-smoothing: antialiased;
}
.sr-only {
border: 0 !important;
clip: rect(1px, 1px, 1px, 1px) !important;
-webkit-clip-path: inset(50%) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
width: 1px !important;
white-space: nowrap !important;
}
ul,
ol {
list-style: none;
}
input,
button,
textarea,
select {
font: inherit;
}
button {
background: none;
border: none;
cursor: pointer;
}
p,
h1,
h2,
h3,
h4,
h5,
h6 {
overflow-wrap: break-word;
}
img,
picture,
video,
canvas,
svg {
display: block;
max-width: 100%;
}
a {
text-decoration: none;
font: inherit;
color: inherit;
&:hover {
text-decoration: underline;
}
}
MIT