From 62a118ddfe42349027a293fb15a2bbeaa769821e Mon Sep 17 00:00:00 2001
From: David DeSandro <david@desandro.com>
Date: Thu, 16 Jun 2011 11:12:14 -0400
Subject: [PATCH] docs : remove .floated class

---
 _includes/elements-demo-head.html             |  2 +-
 _includes/filter-buttons.html                 |  2 +-
 _includes/layout-options.html                 |  2 +-
 _includes/sort-buttons.html                   |  4 ++--
 _posts/demos/2011-01-02-adding-items.html     |  2 +-
 .../demos/2011-03-29-combination-filters.html |  2 +-
 _posts/demos/2011-05-22-category-rows.html    |  2 +-
 _posts/demos/2011-06-13-hash-history.html     |  8 ++++----
 _posts/tests/2011-03-27-flash01.html          |  2 +-
 .../2011-04-26-item-position-data01.html      |  2 +-
 .../tests/2011-05-13-jquery-animation01.html  |  2 +-
 _posts/tests/2011-05-18-centered-masonry.html |  2 +-
 .../2011-05-24-elements-complete-test.html    |  2 +-
 _posts/tests/2011-05-31-tiny-text.html        |  2 +-
 css/style.css                                 | 20 +++++++++++--------
 index.html                                    |  6 +++---
 16 files changed, 33 insertions(+), 29 deletions(-)

diff --git a/_includes/elements-demo-head.html b/_includes/elements-demo-head.html
index a617434..6d911ad 100644
--- a/_includes/elements-demo-head.html
+++ b/_includes/elements-demo-head.html
@@ -12,7 +12,7 @@
 
   <h3>Etc</h3>
 
-  <ul id="etc" class="floated clearfix">
+  <ul id="etc" class="clearfix">
 
     <li id="toggle-sizes"><a href="#toggle-sizes">Toggle variable sizes</a></li>
     <li id="insert"><a href="#insert">Insert new elements</a></li>
diff --git a/_includes/filter-buttons.html b/_includes/filter-buttons.html
index 12202ef..1e95eb3 100644
--- a/_includes/filter-buttons.html
+++ b/_includes/filter-buttons.html
@@ -1,7 +1,7 @@
 
       <h3>Filters</h3>
 
-      <ul id="filters" class="option-set floated clearfix" data-option-key="filter">
+      <ul id="filters" class="option-set clearfix" data-option-key="filter">
         <li><a href="#filter" data-option-value="*" class="selected">show all</a></li>
         <li><a href="#filter" data-option-value=".metal">metal</a></li>
         <li><a href="#filter" data-option-value=".transition">transition</a></li>
diff --git a/_includes/layout-options.html b/_includes/layout-options.html
index 3cacfc0..e806a91 100644
--- a/_includes/layout-options.html
+++ b/_includes/layout-options.html
@@ -1,7 +1,7 @@
 
     <h3>Layout modes</h3>
 
-    <ul id="layouts" class="option-set floated clearfix" data-option-key="layoutMode">
+    <ul id="layouts" class="option-set clearfix" data-option-key="layoutMode">
       <li><a href="#masonry" data-option-value="masonry" class="selected">masonry</a></li>
       <li><a href="#fitRows" data-option-value="fitRows">fitRows</a></li>
       <li><a href="#cellsByRow" data-option-value="cellsByRow">cellsByRow</a></li>
diff --git a/_includes/sort-buttons.html b/_includes/sort-buttons.html
index e87577f..0f3893c 100644
--- a/_includes/sort-buttons.html
+++ b/_includes/sort-buttons.html
@@ -1,7 +1,7 @@
 
     <h3>Sort</h3>
 
-    <ul id="sort" class="sort option-set floated clearfix" data-option-key="sortBy">
+    <ul id="sort" class="sort option-set clearfix" data-option-key="sortBy">
       <li><a href="#sortBy=original-order" data-option-value="original-order" class="selected" data>original-order</a></li>
       <li><a href="#sortBy=name" data-option-value="name">name</a></li>
       <li><a href="#sortBy=symbol" data-option-value="symbol">symbol</a></li>
@@ -12,7 +12,7 @@
 
     <h3>Sort direction</h3>
 
-    <ul id="sort-direction" class="option-set floated clearfix" data-option-key="sortAscending">
+    <ul id="sort-direction" class="option-set clearfix" data-option-key="sortAscending">
       <li><a href="#sortAscending=true" data-option-value="true" class="selected">sort ascending</a></li>
       <li><a href="#sortAscending=false" data-option-value="false">sort descending</a></li>
     </ul>
diff --git a/_posts/demos/2011-01-02-adding-items.html b/_posts/demos/2011-01-02-adding-items.html
index 60af53c..8127f4a 100644
--- a/_posts/demos/2011-01-02-adding-items.html
+++ b/_posts/demos/2011-01-02-adding-items.html
@@ -13,7 +13,7 @@ related: methods
   </section>
 
   <section id="options">
-    <ul class="floated clearfix">
+    <ul class="clearfix">
       <li id="insert"><a href="#insert">Insert new elements</a></li>
       <li id="append"><a href='#append'>Append new elements</a></li>
       <li id="prepend"><a href='#prepend'>Prepend</a></li>
diff --git a/_posts/demos/2011-03-29-combination-filters.html b/_posts/demos/2011-03-29-combination-filters.html
index 9cf6f2b..65e4b73 100644
--- a/_posts/demos/2011-03-29-combination-filters.html
+++ b/_posts/demos/2011-03-29-combination-filters.html
@@ -23,7 +23,7 @@ schema:
   {% for group in page.schema %}
     <div class="option-combo {{ group.name }}">
       <h4>{{ group.name }}</h4>
-      <ul class="filter option-set floated clearfix "> 
+      <ul class="filter option-set clearfix "> 
         <li><a href="#filter-{{ group.name }}-any" data-filter="" data-group="{{ group.name }}" class="selected">any</a>
         {% for filter in group.filters %}
           <li><a href="#filter-{{ group.name }}-{{ filter }}" data-group="{{ group.name }}" data-filter=".{{ filter }}">{{ filter }}</a>
diff --git a/_posts/demos/2011-05-22-category-rows.html b/_posts/demos/2011-05-22-category-rows.html
index bdc47e2..ae26205 100644
--- a/_posts/demos/2011-05-22-category-rows.html
+++ b/_posts/demos/2011-05-22-category-rows.html
@@ -15,7 +15,7 @@ related: layouts
 
   <h3>Etc</h3>
 
-  <ul id="etc" class="floated clearfix">
+  <ul id="etc" class="clearfix">
     <li id="toggle-sizes"><a href="#toggle-sizes">Toggle variable sizes</a></li>
     <li id="insert"><a href="#insert">Insert new elements</a></li>
   </ul>
diff --git a/_posts/demos/2011-06-13-hash-history.html b/_posts/demos/2011-06-13-hash-history.html
index 7edf06e..b4f589b 100644
--- a/_posts/demos/2011-06-13-hash-history.html
+++ b/_posts/demos/2011-06-13-hash-history.html
@@ -13,7 +13,7 @@ related: z-etc
 
   <h3>Filters</h3>
 
-  <ul id="filters" class="option-set floated clearfix" data-option-key="filter">
+  <ul class="option-set clearfix">
     <li><a href="#filter=*" class="selected">show all</a></li>
     <li><a href="#filter=.metal">metal</a></li>
     <li><a href="#filter=.transition">transition</a></li>
@@ -27,7 +27,7 @@ related: z-etc
 
   <h3>Sort</h3>
 
-  <ul id="sort" class="sort option-set floated clearfix">
+  <ul class="option-set clearfix">
     <li><a href="#sortBy=original-order" class="selected">original-order</a></li>
     <li><a href="#sortBy=name">name</a></li>
     <li><a href="#sortBy=symbol">symbol</a></li>
@@ -38,14 +38,14 @@ related: z-etc
   
   <h3>Sort direction</h3>
   
-  <ul id="sort-direction" class="option-set floated clearfix">
+  <ul class="option-set clearfix">
     <li><a href="#sortAscending=true" class="selected">sort ascending</a></li>
     <li><a href="#sortAscending=false">sort descending</a></li>
   </ul>
 
   <h3>Layout modes</h3>
 
-  <ul id="layouts" class="option-set floated clearfix">
+  <ul class="option-set clearfix">
     <li><a href="#layoutMode=masonry" class="selected">masonry</a></li>
     <li><a href="#layoutMode=fitRows">fitRows</a></li>
     <li><a href="#layoutMode=cellsByRow">cellsByRow</a></li>
diff --git a/_posts/tests/2011-03-27-flash01.html b/_posts/tests/2011-03-27-flash01.html
index 7453fa8..0eebc30 100644
--- a/_posts/tests/2011-03-27-flash01.html
+++ b/_posts/tests/2011-03-27-flash01.html
@@ -29,7 +29,7 @@ category: tests
     
     <h3>Filters</h3>
 
-    <ul id="filters" class="option-set floated clearfix" data-option-key="filter">
+    <ul id="filters" class="option-set clearfix" data-option-key="filter">
       <li><a href="#filter-show-all" data-option-value="*" class="selected">show all</a></li>
       <li><a href="#filter-link" data-option-value=".link">link</a></li>
       <li><a href="#filter-audio" data-option-value=".audio">audio</a></li>
diff --git a/_posts/tests/2011-04-26-item-position-data01.html b/_posts/tests/2011-04-26-item-position-data01.html
index 4e1094a..eeec37b 100644
--- a/_posts/tests/2011-04-26-item-position-data01.html
+++ b/_posts/tests/2011-04-26-item-position-data01.html
@@ -14,7 +14,7 @@ category: tests
 
     <h3>Etc</h3>
 
-    <ul id="etc" class="floated clearfix">
+    <ul id="etc" class="clearfix">
 
       <li id="toggle-sizes"><a href="#toggle-sizes">Toggle variable sizes</a></li>
     </ul>
diff --git a/_posts/tests/2011-05-13-jquery-animation01.html b/_posts/tests/2011-05-13-jquery-animation01.html
index 7f8d59f..7fba8fc 100644
--- a/_posts/tests/2011-05-13-jquery-animation01.html
+++ b/_posts/tests/2011-05-13-jquery-animation01.html
@@ -26,7 +26,7 @@ category: tests
 
   <h3>Etc</h3>
 
-  <ul id="etc" class="floated clearfix">
+  <ul id="etc" class="clearfix">
 
     <li id="toggle-sizes"><a href="#toggle-sizes">Toggle variable sizes</a></li>
   </ul>
diff --git a/_posts/tests/2011-05-18-centered-masonry.html b/_posts/tests/2011-05-18-centered-masonry.html
index f33a9da..63e3c23 100644
--- a/_posts/tests/2011-05-18-centered-masonry.html
+++ b/_posts/tests/2011-05-18-centered-masonry.html
@@ -22,7 +22,7 @@ category: tests
 
   <h3>Etc</h3>
 
-  <ul id="etc" class="floated clearfix">
+  <ul id="etc" class="clearfix">
 
     <li id="toggle-sizes"><a href="#toggle-sizes">Toggle variable sizes</a></li>
     <li id="insert"><a href="#insert">Insert new elements</a></li>
diff --git a/_posts/tests/2011-05-24-elements-complete-test.html b/_posts/tests/2011-05-24-elements-complete-test.html
index 316d5b6..68e0a6e 100644
--- a/_posts/tests/2011-05-24-elements-complete-test.html
+++ b/_posts/tests/2011-05-24-elements-complete-test.html
@@ -18,7 +18,7 @@ category: tests
 
   <h3>Etc</h3>
 
-  <ul id="etc" class="floated clearfix">
+  <ul id="etc" class="clearfix">
 
     <li id="toggle-sizes"><a href="#toggle-sizes">Toggle variable sizes</a></li>
     <li id="insert"><a href="#insert">Insert new elements</a></li>
diff --git a/_posts/tests/2011-05-31-tiny-text.html b/_posts/tests/2011-05-31-tiny-text.html
index fa01718..c6227c8 100644
--- a/_posts/tests/2011-05-31-tiny-text.html
+++ b/_posts/tests/2011-05-31-tiny-text.html
@@ -28,7 +28,7 @@ lorem: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
 
   <h3>Filters</h3>
 
-  <ul id="filters" class="option-set floated clearfix" data-option-key="filter">
+  <ul id="filters" class="option-set clearfix" data-option-key="filter">
     <li><a href="#show-all" data-option-value="*" class="selected">show all</a></li>
     <li><a href="#red" data-option-value=".red">red</a></li>
     <li><a href="#blue" data-option-value=".blue">blue</a></li>
diff --git a/css/style.css b/css/style.css
index fd18dbc..4952315 100644
--- a/css/style.css
+++ b/css/style.css
@@ -267,19 +267,19 @@ body {
   margin-left: 1.5em;
 }
 
-#options .floated li {
+#options li {
   float: left;
+  margin-bottom: 0.2em;
 }
 
 #options li a {
-  display: inline-block;
+  display: block;
   padding: 0.4em 0.5em;
   background-color: #DDD;
   color: #222;
   font-weight: bold;
-  margin-bottom: 0.2em;
   text-shadow: 0 1px hsla( 0, 0%, 100%, 0.5 );
-  background-image: -moz-linear-gradient(-90deg, 
+  background-image: -moz-linear-gradient( -90deg, 
     hsla( 0, 0%, 100%, 0.5 ) , 
     hsla( 0, 0%, 100%, 0.0 ) 
   );
@@ -287,6 +287,10 @@ body {
     from( hsla( 0, 0%, 100%, 0.5 ) ), 
     to(   hsla( 0, 0%, 100%, 0.0 ) )
   );
+  background-image: -o-linear-gradient( -90deg, 
+    hsla( 0, 0%, 100%, 0.5 ) , 
+    hsla( 0, 0%, 100%, 0.0 ) 
+  );
 }
 
 #options li a:hover {
@@ -301,21 +305,21 @@ body {
           box-shadow: inset 0 2px 8px hsla( 0, 0%, 0%, 0.6 );
 }
 
-#options .floated li a {
+#options li a {
   border-left:  1px solid hsla( 0, 0%, 100%, 0.3 );
   border-right: 1px solid hsla( 0, 0%,   0%, 0.2 );
 }
 
-#options .floated li:first-child a {
+#options li:first-child a {
   border-radius: 7px 0 0 7px;
   border-left: none;
 }
 
-#options .floated li:last-child a {
+#options li:last-child a {
   border-radius: 0 7px 7px 0;
 }
 
-#options .option-set li a.selected {
+#options li a.selected {
   background-color: #13F;
   text-shadow: none;
   color: white;
diff --git a/index.html b/index.html
index 1f8e4e0..a91c8b1 100644
--- a/index.html
+++ b/index.html
@@ -40,7 +40,7 @@ features:
   <section id="options" class="clearfix">
     <div class="option-combo">
       <h2>Filter:</h2>
-      <ul id="filter" class="option-set floated clearfix" data-option-key="filter">
+      <ul id="filter" class="option-set clearfix" data-option-key="filter">
         <li><a href="#show-all" data-option-value="*" class="selected">show all</a></li>
         <li><a href="#elements" data-option-value=".element:not(.feature)">elements</a></li>
         <li><a href="#features" data-option-value=".feature">features</a></li>
@@ -49,7 +49,7 @@ features:
     </div>
     <div class="option-combo">
       <h2>Sort:</h2>
-      <ul id="sort" class="option-set floated clearfix" data-option-key="sortBy">
+      <ul id="sort" class="option-set clearfix" data-option-key="sortBy">
         <li><a href="#mixed" data-option-value="number" class="selected">mixed</a></li>
         <li><a href="#original" data-option-value="original-order">original</a></li>
         <li><a href="#alphabetical" data-option-value="alphabetical">alphabetical</a></li>
@@ -57,7 +57,7 @@ features:
     </div>
     <div class="option-combo">
       <h2>Layout: </h2>
-      <ul id="layouts" class="option-set floated clearfix" data-option-key="layoutMode">
+      <ul id="layouts" class="option-set clearfix" data-option-key="layoutMode">
         <li><a href="#masonry" data-option-value="masonry" class="selected">masonry</a></li>
         <li><a href="#fitRows" data-option-value="fitRows">fitRows</a></li>
         <li><a href="#straightDown" data-option-value="straightDown">straightDown</a></li>