# Fluid Skinning System demos

Here are some demos showcasing how the Fluid CSS convenience classnames work. The FSS is a completely class based CSS convenience system, and does not focus on typography and grids as heavily as other major CSS frameworks; rather it is designed to help enhance the effectiveness of Fluid components and encourage cleaner markup.

As you read this, page margins, fonts, colors and other basic properties of this page have been modified by the `fluid.reset.css file`

## Helpers

### Widgets layout

The FSS Widget model is composed of 1 core container and 3 sub containers: titlebar, options, and content

The colors are to exaggerate the effect and do not come with the FSS.

## My Widget

- Option 1
- Option 2

this is where the content goes

### Tabs layouts

The FSS Tab model is composed of 1 core wrapper (a list), at least 1 list item, and 1 link inside each list item. This example is in a centered container 750px wide.

The colors are to exaggerate the effect and do not come with the FSS.

- Active Tab
- Tab #2
- Tab #3

Content

- Active Tab
- Tab #2
- Tab #3

Content

- Active Tab
- Tab #2
- Tab #3

Content

### GUI: Menu layouts

The FSS Menu model is composed of 1 core wrapper (a list), at least 1 list item, and 1 link inside each list item

The colors are to exaggerate the effect and do not come with the FSS.

- Menu item #1
- Active Menu item
- Menu item #3
- Menu item #4
- Menu item #5