CodePen

HTML

            
              <ul>
  <li>White Background: Base mobile style</li>
  <li>Orange Background: 460px breakpoint</li>
  <li>Purple Background: 600px breakpoint</li>
  <li>Yellow Background: 768px breakpoint</li>
  <li>Red Background: 992px breakpoint</li>
  <li>Green Background: 1382px breakpoint</li>
  <li>Blue Background: high def. devices</li>
</ul>
            
          
!

↑ Insert the most common viewport meta tag

CSS

            
              @-webkit-viewport {width: device-width;}
@-moz-viewport {width: device-width;}
@-ms-viewport {width: device-width;}
@-o-viewport {width: device-width;}
@viewport {width: device-width;}

html {
  overflow-x: hidden;
  font-size: 66.6%;
  -webkit-overflow-scrolling: touch;
  -webkit-tap-highlight-color: green;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; }

body {
  margin: 0;
  padding: 0;
  width: 100%;
  background-color: transparent;
  font-family: Cambria, Georgia, Times, "Times New Roman";
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 1.5em;
  color: black; }

/*  480px breakpoint  */
@media only screen and (min-width: 480px) {
  body {
    background: orange; } }

/*  600px breakpoint  */
@media only screen and (min-width: 600px) {
  body {
    background: purple; } }

/*  768px breakpoint  */
@media only screen and (min-width: 768px) {
  body {
    background: yellow; } }

/*  992px breakpoint  */
@media only screen and (min-width: 992px) {
  body {
    background: red; } }

/*  1382px breakpoint  */
@media only screen and (min-width: 1382px) {
  body {
    background: green;
    max-width: 1440px; } }

/*  high pixel ratio  */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
  body {
    background: blue; } }

            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................