Creating a fluid layout with YUI Grids requires some custom sizing to achieve the fluid effect.
A fluid grid starts with the basic markup structure of a yui3-g grid and some yui3-u units.
Creating a fluid layout requires manually fixing the sizes and using a combination of padding and negative margins, so we can stick with the basic yui3-u unit. Rather than extending the yui3-u unit directly, we will add some unique IDs to our "columns" to deliver the sizing. The actual IDs are entirely up to you, but by convention should describe your content rather than its presentation or layout. We will apply an ID to the yui3-g container as well, as this is where the padding will be added to create space for the side columns.
We also need to add our custom CSS for the fluid layout. The container for the units is padded to match the widths of each side column, each side column gets a fixed width and a negative margin that matches the fixed width. The center column is set to 100% width, filling the container minus its padding.
``` ```