Skip to content

Instantly share code, notes, and snippets.

@jairusjoer
Last active January 31, 2024 13:27
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jairusjoer/5a66ec481142e157e404b4ed1ebf533e to your computer and use it in GitHub Desktop.
Save jairusjoer/5a66ec481142e157e404b4ed1ebf533e to your computer and use it in GitHub Desktop.
An opinionated yet extensible CSS reset for various project scopes
:root {
font-size: max(calc(16vmin * 100 / 1440), 16px);
}
*:where(:not(iframe, canvas, img, svg, video):not(svg *)) {
all: unset;
display: revert;
outline: revert;
}
[hidden] {
display: none;
}
*,
*::before,
*::after {
box-sizing: border-box;
}
a,
span {
display: inline-block;
}
a,
button {
cursor: pointer;
}
body {
line-height: 1.5;
min-width: 20rem;
}
button {
appearance: none;
}
footer {
margin-top: auto;
}
html {
font-family: system-ui, sans-serif;
scroll-behavior: smooth;
text-size-adjust: 100%;
}
img,
video {
display: block;
object-fit: cover;
}
img {
max-width: 100%;
}
main[tabindex='-1'] {
outline: none;
}
strong {
font-weight: bold;
}
svg {
display: block;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment