h5bp/html5-boilerplate — Issue #882: Improvements on HTML5 Boilerplate's CSS
Author: briansahagun
Created: 2011-12-08 05:45:59+00:00
State: open

* Put /* For Image Replacement */ on top of your custom CSS to prevent the .ir styles from overriding your own declarations.
* In case you need to declare your #logo with a display:inline-block, the display:block of .ir would be overridden.
* Addition of style for responsive images
* img, object, embed {max-width:100%;}
* img {height:auto;}
* In cases of short content, the Body and Footer shoudl have the same background color to show continuity of color at the bottom of the page (instead of having a Footer bg color and another bg color for body).
* body, footer {background-color:red;}
* Minimum height for content to push the footer down a bit (should be removed for mobile styles)
* #content {min-height:400px;}
* For media queries, higher max-width should be declared first than lower max-width to avoid the higher max-width interfering with the lower max-width. This is particulary useful if you have different pixel width declaration for both media queries.
* @media only screen and (max-width:1023px) should go above @media only screen and (max-width:767px)

http://chewyui.com/2011/12/08/improvements-on-html5-boilerplate/