From 28da31218fc5dc39ece625705c37b8c86d494801 Mon Sep 17 00:00:00 2001
From: Mark Otto <otto@github.com>
Date: Sun, 4 Nov 2012 12:36:37 -0800
Subject: [PATCH] Refine new inline list option

---
 docs/assets/css/bootstrap.css          | 27 ++++----------------------
 docs/base-css.html                     | 12 ++++++------
 docs/templates/pages/base-css.mustache | 12 ++++++------
 less/type.less                         | 22 ++++++++++-----------
 4 files changed, 26 insertions(+), 47 deletions(-)

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 35cfe82407..b2675f6403 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -816,33 +816,14 @@ ol.unstyled {
 
 ul.inline,
 ol.inline {
-  *zoom: 1;
-}
-
-ul.inline:before,
-ol.inline:before,
-ul.inline:after,
-ol.inline:after {
-  display: table;
-  line-height: 0;
-  content: "";
-}
-
-ul.inline:after,
-ol.inline:after {
-  clear: both;
+  list-style: none;
 }
 
 ul.inline > li,
 ol.inline > li {
-  float: left;
-  margin-right: 14px;
-  margin-left: 12px;
-}
-
-ul.unstyled.inline > li,
-ol.unstyled.inline > li {
-  padding-left: 0;
+  display: inline-block;
+  padding-right: 5px;
+  padding-left: 5px;
 }
 
 dl {
diff --git a/docs/base-css.html b/docs/base-css.html
index 8cc571210c..dd34401d54 100644
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -377,16 +377,16 @@
 </pre>
 
         <h3>Inline</h3>
-        <p>A list of floated left items. Can be combined with with <code>.unstyled</code></p>
+        <p>Place all list items on a single line with <code>inline-block</code> and some light padding.</p>
         <div class="bs-docs-example">
-          <ul class="unstyled inline">
-            <li><span class="label label-important">&nbsp;&nbsp;</span> Stop signal</li>
-            <li><span class="label label-warning">&nbsp;&nbsp;</span> Prepare for signal</li>
-            <li><span class="label label-success">&nbsp;&nbsp;</span> Go!</li>
+          <ul class="inline">
+            <li>Lorem ipsum</li>
+            <li>Phasellus iaculis</li>
+            <li>Nulla volutpat</li>
           </ul>
         </div>
 <pre class="prettyprint linenums">
-&lt;ul class="unstyled inline"&gt;
+&lt;ul class="inline"&gt;
   &lt;li&gt;...&lt;/li&gt;
 &lt;/ul&gt;
 </pre>
diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache
index 38201f6834..6fc646e8c8 100644
--- a/docs/templates/pages/base-css.mustache
+++ b/docs/templates/pages/base-css.mustache
@@ -314,16 +314,16 @@
 </pre>
 
         <h3>{{_i}}Inline{{/i}}</h3>
-        <p>{{_i}}A list of floated left items. Can be combined with with <code>.unstyled</code>{{/i}}</p>
+        <p>{{_i}}Place all list items on a single line with <code>inline-block</code> and some light padding.{{/i}}</p>
         <div class="bs-docs-example">
-          <ul class="unstyled inline">
-            <li><span class="label label-important">&nbsp;&nbsp;</span> Stop signal</li>
-            <li><span class="label label-warning">&nbsp;&nbsp;</span> Prepare for signal</li>
-            <li><span class="label label-success">&nbsp;&nbsp;</span> Go!</li>
+          <ul class="inline">
+            <li>Lorem ipsum</li>
+            <li>Phasellus iaculis</li>
+            <li>Nulla volutpat</li>
           </ul>
         </div>
 <pre class="prettyprint linenums">
-&lt;ul class="unstyled inline"&gt;
+&lt;ul class="inline"&gt;
   &lt;li&gt;...&lt;/li&gt;
 &lt;/ul&gt;
 </pre>
diff --git a/less/type.less b/less/type.less
index d23ecc917f..0d5b9c37ee 100644
--- a/less/type.less
+++ b/less/type.less
@@ -106,25 +106,23 @@ ol ul {
 li {
   line-height: @baseLineHeight;
 }
+
+// Remove default list styles
 ul.unstyled,
 ol.unstyled {
   margin-left: 0;
   list-style: none;
 }
+
+// Single-line list items
 ul.inline,
 ol.inline {
-  .clearfix();
-}
-ul.inline > li,
-ol.inline > li {
-  float: left;
-  margin-right: 14px;
-  margin-left: 12px;
-}
-// Reset left padding for unstyled
-ul.unstyled.inline > li,
-ol.unstyled.inline > li {
-  padding-left: 0;
+  list-style: none;
+  & > li {
+    display: inline-block;
+    padding-left: 5px;
+    padding-right: 5px;
+  }
 }
 
 // Description Lists