Update HiDPI CSS @media rule

necolas · necolas · commit 1987e5a1ee46 · 2012-12-28T12:31:58.000Z
Provide greater cross-browser support. Thanks to Wordpress - http://core.trac.wordpress.org/changeset/22629 - and @marcedwards - see issue h5bp#1127.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,7 @@
 ### HEAD
 
+* Update HiDPI example media query ([#1127](https://github.com/h5bp/html5-boilerplate/issues/1127)).
+
 ### 4.0.2 (9 December, 2012)
 
 * Update placeholder icons.
diff --git a/css/main.css b/css/main.css
@@ -220,8 +220,10 @@ textarea {
     /* Style adjustments for viewports that meet the condition */
 }
 
-@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
-       only screen and (min-resolution: 144dpi) {
+@media print,
+       (-o-min-device-pixel-ratio: 5/4),
+       (-webkit-min-device-pixel-ratio: 1.25),
+       (min-resolution: 120dpi) {
     /* Style adjustments for high resolution devices */
 }
 

Original file line number	Diff line number	Diff line change
`@@ -220,8 +220,10 @@ textarea {`
`220`	`220`	`/* Style adjustments for viewports that meet the condition */`
`221`	`221`	`}`
`222`	`222`
`223`		`-@media only screen and (-webkit-min-device-pixel-ratio: 1.5),`
`224`		`- only screen and (min-resolution: 144dpi) {`
	`223`	`+@media print,`
	`224`	`+ (-o-min-device-pixel-ratio: 5/4),`
	`225`	`+ (-webkit-min-device-pixel-ratio: 1.25),`
	`226`	`+ (min-resolution: 120dpi) {`
`225`	`227`	`/* Style adjustments for high resolution devices */`
`226`	`228`	`}`
`227`	`229`