Skip to content

Instantly share code, notes, and snippets.

@nicholasstephan

nicholasstephan/main.css

Last active December 15, 2015 21:39
Download ZIP

Revisions

  1. nicholasstephan renamed this gist Jun 21, 2013. 1 changed file with 0 additions and 0 deletions.
    0 gistfile1 → main.css
    View file
    File renamed without changes.
  2. nicholasstephan created this gist Apr 6, 2013.
    53 changes: 53 additions & 0 deletions gistfile1
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,53 @@
    @media only screen and (min-width: 320px) {

    /* Small screen, non-retina */

    }

    @media
    only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 320px),
    only screen and ( min--moz-device-pixel-ratio: 2) and (min-width: 320px),
    only screen and ( -o-min-device-pixel-ratio: 2/1) and (min-width: 320px),
    only screen and ( min-device-pixel-ratio: 2) and (min-width: 320px),
    only screen and ( min-resolution: 192dpi) and (min-width: 320px),
    only screen and ( min-resolution: 2dppx) and (min-width: 320px) {

    /* Small screen, retina, stuff to override above media query */

    }

    @media only screen and (min-width: 700px) {

    /* Medium screen, non-retina */

    }

    @media
    only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 700px),
    only screen and ( min--moz-device-pixel-ratio: 2) and (min-width: 700px),
    only screen and ( -o-min-device-pixel-ratio: 2/1) and (min-width: 700px),
    only screen and ( min-device-pixel-ratio: 2) and (min-width: 700px),
    only screen and ( min-resolution: 192dpi) and (min-width: 700px),
    only screen and ( min-resolution: 2dppx) and (min-width: 700px) {

    /* Medium screen, retina, stuff to override above media query */

    }

    @media only screen and (min-width: 1300px) {

    /* Large screen, non-retina */

    }

    @media
    only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 1300px),
    only screen and ( min--moz-device-pixel-ratio: 2) and (min-width: 1300px),
    only screen and ( -o-min-device-pixel-ratio: 2/1) and (min-width: 1300px),
    only screen and ( min-device-pixel-ratio: 2) and (min-width: 1300px),
    only screen and ( min-resolution: 192dpi) and (min-width: 1300px),
    only screen and ( min-resolution: 2dppx) and (min-width: 1300px) {

    /* Large screen, retina, stuff to override above media query */

    }