Mobile Responsive Design

Add to favorites

When creating mobile optimization stick to only 2 media queries. This is a good rule of thumb to keep your CSS compatible throughout and clean, there is no standard or rule saying you are not allowed to use other media queries.
It’s just a something I learnt works well for me to keep things compatible throughout and keeps code cleaner.

@media only screen and (min-width: 1024px) {
  body {
    background-color: lightblue;
  }
}

@media only screen and (max-width: 1023px) {
  body {
    background-color: lightblue;
  }
}