From 47b6e6bd80040cdaa50c27cb7eb11881df679eee Mon Sep 17 00:00:00 2001
From: Mark Otto <markotto@twitter.com>
Date: Wed, 18 Apr 2012 09:47:30 -0700
Subject: [PATCH] fix #3111, badge and label alignment with surrounding text

---
 docs/assets/css/bootstrap.css |  2 +-
 less/labels-badges.less       |  2 +-
 less/tests/css-tests.html     | 28 ++++++++++++++++++++++++++++
 3 files changed, 30 insertions(+), 2 deletions(-)

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 00485499fd..43bba2beec 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -3740,7 +3740,7 @@ a.thumbnail:hover {
   font-weight: bold;
   line-height: 14px;
   color: #ffffff;
-  vertical-align: middle;
+  vertical-align: baseline;
   white-space: nowrap;
   text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
   background-color: #999999;
diff --git a/less/labels-badges.less b/less/labels-badges.less
index e29f2c4340..0fbd7bbc61 100644
--- a/less/labels-badges.less
+++ b/less/labels-badges.less
@@ -8,7 +8,7 @@
   font-weight: bold;
   line-height: 14px; // ensure proper line-height if floated
   color: @white;
-  vertical-align: middle;
+  vertical-align: baseline;
   white-space: nowrap;
   text-shadow: 0 -1px 0 rgba(0,0,0,.25);
   background-color: @grayLight;
diff --git a/less/tests/css-tests.html b/less/tests/css-tests.html
index 58e25be612..a39dde53db 100644
--- a/less/tests/css-tests.html
+++ b/less/tests/css-tests.html
@@ -462,6 +462,10 @@
 <!-- Tabs
 ================================================== -->
 
+<div class="page-header">
+  <h1>Tabs</h1>
+</div>
+
 <div class="tabbable tabs-left" style="margin-bottom: 18px;">
   <ul class="nav nav-tabs">
     <li class="active"><a href="#tab1" data-toggle="tab">Section 1</a></li>
@@ -502,6 +506,30 @@
 
 
 
+<!-- Labels
+================================================== -->
+
+<div class="page-header">
+  <h1>Labels</h1>
+</div>
+
+<div class="row">
+  <div class="span4">
+    <h4>Inline label</h4>
+    <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Maecenas sed diam <span class="label label-warning">Label name</span> eget risus varius blandit sit amet non magna. Fusce <code>.class-name</code> dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
+  </div><!--/span-->
+  <div class="span4">
+    <form class="form-horizontal">
+      <label>Example label</label>
+      <input type="text" placeholder="Input"> <span class="help-inline"><span class="label">Hey!</span> Read this.</span>
+    </form>
+  </div><!--/span-->
+  <div class="span4">
+
+  </div><!--/span-->
+</div><!--/row-->
+
+