Making a simple sortable list with floated nodes.

{{> sortable-float-source-color-step-html}}

Setting Up the List

First we need to create the HTML structure for the list. Since `Sortable` uses `Y.DD.Delegate`, we need to set up a delegation container (`#demo`) and the list items (`em`).

``` {{>sortable-float-source-html}} ```

Now we give the list some CSS to make it visible.

``` {{>sortable-float-source-css}} ```

Setting Up the YUI Instance

Now we need to create our YUI instance and tell it to load the `sortable` module.

``` YUI().use('sortable', function (Y) { // Code here. }); ```

Making the List Draggable

Now that we have a YUI instance with the `sortable` module, we need to instantiate the `Sortable` instance on the list.

``` {{>sortable-float-source-js}} ```