CSS: YUI Grids

I thought this would be good to share as a couple of people
on the list are looking for CSS solutions.

On the CSS front, I've started using Yahoo's Grids Framework
with the Vufind interface (http://www.vufind.org/dem
o/). Because I want the HTML to easily accommodate
institutions that don't want to completely rewrite the CSS
& HTML, I am finding it to work pretty well. Among other
things you can swap the columns and change the width by
changing one class in the main wrap. Also, it is source
order independent, meaning I can keep my content at the top
of the HTML file and the menus at the bottom, despite where
they are on the screen. I also really like how the actual
width is based on ems not pixels, so when you increase the
font size the whole page zooms rather than just the words in
the columns.

Here is what the framework supports:

"The foundational YUI Grids CSS file offers three
preset page widths, seven core templates, and the ability to
nest subdivided regions of one to four columns. All told,
the file offers almost 200 preset layouts and an unlimited
number of custom permutations that work across all A-grade
browsers, all for less than 2.5kb of minimized file weight.
Other features include:

* Supports fluid-width (100%) layouts.
* Supports preset fixed-width layouts at 750px and 950px.
* Supports easy customization of the width for fixed-width
layouts.
* Flexible in response to user initiated font-size
adjustments.
* Template columns are source-order independence, so you can
put your most important content first in the markup layer
for improved accessibility and search engine optimization
(SEO).
* Self-clearing footer. No matter which column is longer,
the footer stays at the bottom.
* Automatically centers within the viewport pages less than
100%.
* Offers full A-grade browser support."

The downside is that I find myself adding a few extra divs
here and there where I might not otherwise... which makes me
wonder if I am making some mistakes. There is still some
cleaning to do on the VuFind site, but overall YUI Grids
have made things a lot more flexible. For small sites it
would be overkill, but for larger sites I think it would
work great once you get your head wrapped around it.

Would love to know if anyone else has tried this out and
what they think.

You can find all of the YUI Grids documentation here: http://develope
r.yahoo.com/yui/grids/

Cheers,
Chris

------------------------------------
http://library.villanova
.edu
http://www.vufind.org
_______________________________________________
Web4lib mailing list
Web4libwebjunction.org
http://lists.we
bjunction.org/web4lib/