cd /news/developer-tools/css-reset-by-kevin-powell-css · home topics developer-tools article
[ARTICLE · art-13357] src=gist.github.com ↗ pub= topic=developer-tools verified=true sentiment=· neutral

CSS: Reset by Kevin Powell.css

Kevin Powell's CSS reset is a modern stylesheet that normalizes default browser styling by removing margins and padding, setting box-sizing to border-box for all elements, and establishing responsive media defaults. It also includes accessibility features like a dark color scheme preference, balanced text wrapping for headings, and smooth scrolling for targeted sections when the user hasn't disabled motion. The reset is designed to provide a clean, consistent foundation for web development projects.

read1 min publishedJan 5, 2024

CSS: Reset by Kevin Powell.css

  This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.

Learn more about bidirectional Unicode characters

Show hidden characters
/* 

*   Kevin Powell

*   https://youtu.be/cCAtD_BAHNw 

*/

*, *::before, *::after {

  box-sizing: border-box;

}

* {

  margin: 0;

  padding: 0;

font: inherit; /* Get rid of all font sizes and heights */

} html {

color-scheme: dark light; /* Default dark / hanging-punctuation: first last; / Not supported in Chrome */

} body {

  min-height: 100vh;

}

/* Media responsive */

img, picture, svg, video {

  display: block;

  max-width: 100%;

}

h1, h2, h3, h4, h5, h6 {

  text-wrap: balance;

}

p {

  max-width: 75ch;

  text-wrap: pretty; /* Prevents orphans on lines */

}

@media (prefers-reduced-motion: no-preference) {

  :has(:target) {

    scroll-behavior: smooth;

    scroll-padding-top: 3rem;

  }

}
── more in #developer-tools 4 stories · sorted by recency
sponsored brought to you by zahid.host 4,200+ EU-deployed projects
reading about agents? ship yours in a single git push.

Run your AI side-project on zahid.host

EU-based hosting, git-push deploys, automatic HTTPS, no cold starts. Free tier with a custom domain — perfect for shipping the agent you just read about.

$git push zahid main
Live at https://your-agent.zahid.host
Get free account → Pricing
from €0/mo · no card required
LIVE [news/css-reset-by-kevin-p…] indexed:0 read:1min 2024-01-05 ·