StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>I've looked at BluePrint and a few others and the only CSS 'framework' I'd recommend is <a href="http://developer.yahoo.com/yui/grids/" rel="nofollow noreferrer">YUI Grids</a></p> <p>Pros:</p> <ul> <li>Written by one of the best frontend engineers out there (IMO) (Nate Koechley)</li> <li>Very small. 4KB</li> <li>Very flexible (1000 different layouts)</li> <li>Supports fluid-width (100%) layouts as well as preset fixed-width layouts at 750px, 950px, and 974px, and the ability to easily customize to any number.</li> <li>Supports easy customization of the width for fixed-width layouts.</li> <li>Template columns are source-order independent, so you can put your most important content first in the markup layer for improved accessibility and search engine optimization (SEO).</li> <li>Self-clearing footer. No matter which column is longer, the footer stays at the bottom.</li> <li>Layouts less than 100% are automatically centered.</li> <li>Somewhat semantic classnames (better than top, left, right, etc)</li> </ul> <p>Cons:</p> <ul> <li>Lots of extra markup compared to hand-written HTML and CSS</li> <li>Takes some learning to figure out how to do complex layouts</li> </ul> <p>As other have posted, there are no real 'frameworks' for CSS. <a href="http://developer.yahoo.com/yui/reset/" rel="nofollow noreferrer">Reset</a> stylesheets help a lot with layout too. I usually stick with a reset stylesheet and go from there. But if you don't have a lot of CSS experience YUI Grids could save you some time.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload