Created
April 8, 2017 09:10
-
-
Save marcusseong/ba86fc68da9224f3a5823ab8066455a2 to your computer and use it in GitHub Desktop.
Revisions
-
dustinboston revised this gist
Oct 11, 2012 . 1 changed file with 0 additions and 1 deletion.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -148,7 +148,6 @@ @media all and (max-height: 480px) and (orientation: portrait) {} @media all and (max-height: 480px) and (orientation: landscape) {} /* [dConstruct](http://2012.dconstruct.org/) ========================================================================== */ -
Oct 11, 2012 . 1 changed file with 7 additions and 0 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -1,3 +1,10 @@ /* This is a small sampling of the various approaches to media queries. The point is: they're all over the board. Part of the "issue" (if you can call it that) may be due to the intended audience of each site/framework. Another may be that it's really difficult to test for a lot of different devices. Regardless, it would be really nice if there was standard baseline that could be used as a starting point for maximum compatibility and coverage. */ /* ========================================================================== Frameworks ========================================================================== */ -
Oct 11, 2012 . 1 changed file with 14 additions and 1 deletion.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -120,7 +120,7 @@ @media only screen and (min-width: 961px) {} @media only screen and (min-width: 1200px) {} /* [(New) Myspace](http://new.myspace.com/) ========================================================================== */ @media all and (max-width: 950px) {} @@ -140,3 +140,16 @@ @media all and (min-height: 900px) {} @media all and (max-height: 480px) and (orientation: portrait) {} @media all and (max-height: 480px) and (orientation: landscape) {} /* [dConstruct](http://2012.dconstruct.org/) ========================================================================== */ @media only screen and (min-width : 45em) and (max-width : 55em) {} @media only screen and (min-width : 50em) and (max-width : 55em) {} @media only screen and (min-width: 55em) {} @media only screen and (min-width: 65em) {} @media only screen and (min-width: 70em) {} @media only screen and (min-width: 72em) {} @media only screen and (min-width: 85em) {} @media only screen and (min-width: 95em) {} -
Oct 11, 2012 . 1 changed file with 19 additions and 0 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -120,4 +120,23 @@ @media only screen and (min-width: 961px) {} @media only screen and (min-width: 1200px) {} /* [(New) Myspace](http://www.hsgac.senate.gov/) ========================================================================== */ @media all and (max-width: 950px) {} @media all and (max-width: 800px) {} @media all and (max-width: 700px) {} @media all and (max-width: 480px) {} @media all and (max-width: 350px) {} @media all and (max-height: 650px) {} @media all and (max-height: 500px) {} @media all and (min-height: 650px) {} @media all and (min-height: 600px) {} @media all and (min-width: 900px) {} @media all and (min-width: 1000px) and (min-height: 550px) {} @media all and (min-width: 1000px) and (min-height: 700px) {} @media all and (min-height: 900px) {} @media all and (max-height: 480px) and (orientation: portrait) {} @media all and (max-height: 480px) and (orientation: landscape) {} -
Oct 11, 2012 . 1 changed file with 24 additions and 55 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -30,55 +30,25 @@ /* [Golden Grid System](http://goldengridsystem.com/) ========================================================================== */ @media screen and (min-width: 40em) {} /* 640px */ @media screen and (min-width: 45em) {} /* 720px */ @media screen and (min-width: 55.5em) {} /* 888px */ @media screen and (min-width: 61.5em) {} /* 984px */ @media screen and (min-width: 75em) {} /* 1200px */ @media screen and (min-width: 87em) {} /* 1392px */ @media screen and (min-width: 105em) {} /* 1680px */ @media screen and (min-width: 117em) {} /* 1872px */ @media screen and (min-width: 130em) {} /* 2080px */ /* [Fluid Baseline Grid](http://fluidbaselinegrid.com/) ========================================================================== */ @media only screen and (min-width: 320px) {} @media only screen and (min-width: 480px) {} @media only screen and (min-width: 600px) {} @media only screen and (min-width: 768px) {} @media only screen and (min-width: 1024px) {} @media only screen and (min-width: 1280px) {} @media only screen and (min-width: 1400px) {} @@ -112,18 +82,13 @@ /* [Hicksdesign](http://hicksdesign.co.uk/) ========================================================================== */ @media handheld and (max-width: 480px), screen and (max-device-width: 480px), screen and (max-width: 600px) {} @media screen and (min-width: 920px) {} @media screen and (min-width: 1350px) {} @media screen and (min-width: 1500px) {} @media only screen and (max-device-width: 480px) {} @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {} /* [Simon Collison](http://colly.com/) @@ -133,22 +98,26 @@ screen and (max-device-width:480px), (max-device-width:480px) and (orientation:landscape), (min-device-width:481px) and (max-device-width:1024px) and (orientation:portrait) {} @media (min-device-width:1024px) and (max-width:509px), (max-device-width:480px) and (orientation:portrait) {} /* [Ethan Marcotte](http://ethanmarcotte.com/) ========================================================================== */ @media screen and (max-device-width: 480px), screen and (max-width: 600px) {} @media screen and (min-width: 600px) {} @media screen and (min-width: 860px) {} @media screen and (min-width: 1200px) {} /* [Homeland Security](http://www.hsgac.senate.gov/) ========================================================================== */ @media only screen and (max-width: 1265px) {} @media only screen and (max-width: 960px) {} @media only screen and (max-width: 767px) {} @media only screen and (max-width: 479px) {} @media only screen and (min-width: 961px) {} @media only screen and (min-width: 1200px) {} -
Oct 11, 2012 . 1 changed file with 0 additions and 2 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -86,8 +86,6 @@ Websites ========================================================================== */ /* [Boston Globe](http://www.bostonglobe.com/) ========================================================================== */ -
Oct 11, 2012 . 1 changed file with 25 additions and 0 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -86,6 +86,31 @@ Websites ========================================================================== */ ,globe-masthead.css,globe-nav.css,globe-nav-menus.css,globe-saved.css,globe-main.css,globe-footer.css,globe-print.css /* [Boston Globe](http://www.bostonglobe.com/) ========================================================================== */ /* globe-main.css */ @media (max-device-width: 480px) {} @media screen and (min-width: 480px), print {} @media screen and (min-width: 480px) and (max-width: 639px), print {} @media screen and (min-width: 481px) and (max-width: 799px), print {} @media screen and (min-width: 788px) and (max-width: 1050px), print {} @media screen and (max-width:639px) {} @media screen and (min-width: 640px) and (max-width: 809px), print {} @media screen and (min-width: 600px), print {} @media screen and (min-width: 640px), print {} @media screen and (min-width: 810px), print {} @media screen and (min-width: 810px) {} @media screen and (min-width: 810px) and (max-width: 930px) {} @media screen and (min-width: 931px) {} @media screen and (min-width: 900px) {} @media screen and (min-width: 1100px) {} @media screen and (min-width: 1200px) {} @media screen and (min-width: 1400px){} @media print {} /* [Hicksdesign](http://hicksdesign.co.uk/) ========================================================================== */ -
Oct 10, 2012 . 1 changed file with 57 additions and 8 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -1,5 +1,8 @@ /* ========================================================================== Frameworks ========================================================================== */ /* [Bootstrap](http://twitter.github.com/bootstrap/) ========================================================================== */ @media (min-width: 768px) and (max-width: 979px) {} @@ -11,8 +14,7 @@ @media (max-width: 979px) {} @media (min-width: 980px) {} /* [320 and Up](http://stuffandnonsense.co.uk/projects/320andup/) ========================================================================== */ @media only screen and (min-width: 480px) {} @@ -25,8 +27,7 @@ only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {} /* [Golden Grid System](http://goldengridsystem.com/) ========================================================================== */ /* @media screen and (min-width: 640px) */ @@ -56,8 +57,7 @@ /* @media screen and (min-width: 2080px) */ @media screen and (min-width: 130em) {} /* [Fluid Baseline Grid](http://fluidbaselinegrid.com/) ========================================================================== */ /* MOBILE PORTRAIT */ @@ -79,4 +79,53 @@ @media only screen and (min-width: 1280px) {} /* WIDESCREEN */ @media only screen and (min-width: 1400px) {} /* ========================================================================== Websites ========================================================================== */ /* [Hicksdesign](http://hicksdesign.co.uk/) ========================================================================== */ /*layouts smaller than 600px, iPhone and mobiles*/ @media handheld and (max-width: 480px), screen and (max-device-width: 480px), screen and (max-width: 600px) {} /*layouts larger than 900px*/ @media screen and (min-width: 920px) {} @media screen and (min-width: 1350px) {} @media screen and (min-width: 1500px) {} /*Just iPhone*/ @media only screen and (max-device-width: 480px) {} /*iPad styles*/ @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {} /* [Simon Collison](http://colly.com/) ========================================================================== */ @media (min-device-width:1024px) and (max-width:989px), screen and (max-device-width:480px), (max-device-width:480px) and (orientation:landscape), (min-device-width:481px) and (max-device-width:1024px) and (orientation:portrait) {} @media (min-device-width:1024px) and (max-width:509px), (max-device-width:480px) and (orientation:portrait) {} /* [Ethan Marcotte](http://ethanmarcotte.com/) ========================================================================== */ /* Small screen! */ @media screen and (max-device-width: 480px), screen and (max-width: 600px) {} /* Still small! (but scaling up) */ @media screen and (min-width: 600px) {} /* Desktop! */ @media screen and (min-width: 860px) {} /* IT'S OVER 9000 */ @media screen and (min-width: 1200px) {} -
Oct 10, 2012 . 1 changed file with 13 additions and 5 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -1,4 +1,6 @@ /* ========================================================================== Bootstrap ========================================================================== */ @media (min-width: 768px) and (max-width: 979px) {} @media (max-width: 767px) {} @@ -9,7 +11,9 @@ @media (max-width: 979px) {} @media (min-width: 980px) {} /* ========================================================================== 320 and Up ========================================================================== */ @media only screen and (min-width: 480px) {} @media only screen and (min-width: 600px) {} @@ -21,7 +25,9 @@ only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {} /* ========================================================================== Golden Grid System ========================================================================== */ /* @media screen and (min-width: 640px) */ @media screen and (min-width: 40em) {} @@ -50,7 +56,9 @@ /* @media screen and (min-width: 2080px) */ @media screen and (min-width: 130em) {} /* ========================================================================== Fluid Baseline Grid ========================================================================== */ /* MOBILE PORTRAIT */ @media only screen and (min-width: 320px) {} @@ -71,4 +79,4 @@ @media only screen and (min-width: 1280px) {} /* WIDESCREEN */ @media only screen and (min-width: 1400px) {} -
Anonymous renamed this gist
Oct 10, 2012 . 1 changed file with 0 additions and 0 deletions.There are no files selected for viewing
File renamed without changes. -
Oct 10, 2012 .There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -0,0 +1,74 @@ /* === Bootstrap === */ @media (min-width: 768px) and (max-width: 979px) {} @media (max-width: 767px) {} @media (min-width: 1200px) {} @media (min-width: 768px) and (max-width: 979px) {} @media (max-width: 767px) {} @media (max-width: 480px) {} @media (max-width: 979px) {} @media (min-width: 980px) {} /* === 320 and Up === */ @media only screen and (min-width: 480px) {} @media only screen and (min-width: 600px) {} @media only screen and (min-width: 768px) {} @media only screen and (min-width: 992px) {} @media only screen and (min-width: 1382px) {} @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) {} /* === Golden-Grid-System === */ /* @media screen and (min-width: 640px) */ @media screen and (min-width: 40em) {} /* @media screen and (min-width: 720px) */ @media screen and (min-width: 45em) {} /* @media screen and (min-width: 888px) */ @media screen and (min-width: 55.5em) {} /* @media screen and (min-width: 984px) */ @media screen and (min-width: 61.5em) {} /* @media screen and (min-width: 1200px) */ @media screen and (min-width: 75em) {} /* @media screen and (min-width: 1392px) */ @media screen and (min-width: 87em) {} /* @media screen and (min-width: 1680px) */ @media screen and (min-width: 105em) {} /* @media screen and (min-width: 1872px) */ @media screen and (min-width: 117em) {} /* @media screen and (min-width: 2080px) */ @media screen and (min-width: 130em) {} /* === Fluid Baseline Grid === */ /* MOBILE PORTRAIT */ @media only screen and (min-width: 320px) {} /* MOBILE LANDSCAPE */ @media only screen and (min-width: 480px) {} /* SMALL TABLET */ @media only screen and (min-width: 600px) {} /* TABLET/NETBOOK */ @media only screen and (min-width: 768px) {} /* LANDSCAPE TABLET/NETBOOK/LAPTOP */ @media only screen and (min-width: 1024px) {} /* DESKTOP */ @media only screen and (min-width: 1280px) {} /* WIDESCREEN */ @media only screen and (min-width: 1400px) {}