Skip to content

Instantly share code, notes, and snippets.

@basham
Last active May 21, 2024 16:49
Show Gist options
  • Save basham/3b24062dfaecaa712a68 to your computer and use it in GitHub Desktop.
Save basham/3b24062dfaecaa712a68 to your computer and use it in GitHub Desktop.
CSS Media Queries: Best Practices

CSS Media Queries: Best Practices

/* Style for every viewport width. */
.Component {
  background-color: tomato;
  color: black;
}

/* Style for viewports greater than 320px wide. */ 
@media (min-width: 20em) {
  .Component {
    background-color: blue;
  }
}
@Tecayehuatl
Copy link

"Never use media queries to define styles for the smallest viewport size." I would edit this point, because only works for progressive enhancement, not for graceful degradation(at least not for this best practices list).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment