Skip to content

Instantly share code, notes, and snippets.

@brahimvandenbrande
Created July 31, 2024 09:31
Show Gist options
  • Select an option

  • Save brahimvandenbrande/af92c6212f7f2e7628b537c6c66165d6 to your computer and use it in GitHub Desktop.

Select an option

Save brahimvandenbrande/af92c6212f7f2e7628b537c6c66165d6 to your computer and use it in GitHub Desktop.
This CSS code uses media queries to hide elements based on screen size: .hide-mobile: Hides elements on screens up to 767px wide. .hide-tablet: Hides elements on screens between 768px and 1023px wide. .hide-desktop: Hides elements on screens 1024px and wider.
@media screen and (max-width: 767px) {
.hide-mobile {
display: none;
}
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
.hide-tablet {
display: none;
}
}
@media screen and (min-width: 1024px) {
.hide-desktop {
display: none;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment