Fluid 2-column layout
When added to the xy.css matrix, a few lines of CSS produce what you see here: a concise 2-column layout with the following features:
- 100% parent width (slap it anywhere)
- flexible, fluid column widths
- works in all modern browsers
- scales to any size screen
- built with liquid matrix :)
Features of xy.css
As seen in the next column, only a few lines of CSS are needed for this basic 2-column layout. That code should work fine as-is, but when added to the xy.css matrix, it’s like building with liquid lego blocks. You just start snapping layout items into place and let the CSS matrix work the magic.
- Grid-based, liquid layout
- Horizontal grid for lateral rhythm
- Vertical/typographic grid
- Responsive
@mediaqueries - Plus much more