From b9413460afe2bdfac18889953447622d13eb1968 Mon Sep 17 00:00:00 2001 From: Pete Hopkins Date: Thu, 26 Jan 2012 16:02:27 -0500 Subject: [PATCH] Makes inputs and buttons align middle so they line up in all browsers --- lib/buttons.less | 7 ++++--- lib/forms.less | 8 ++++---- lib/reset.less | 3 +-- 3 files changed, 9 insertions(+), 9 deletions(-) diff --git a/lib/buttons.less b/lib/buttons.less index cebacd049b..240e117e2b 100644 --- a/lib/buttons.less +++ b/lib/buttons.less @@ -66,9 +66,9 @@ .btn { // Button Base display: inline-block; - padding: 5px 10px 6px; + padding: 4px 10px 4px; font-size: @baseFontSize; - line-height: normal; + line-height: @baseLineHeight; color: @grayDark; text-shadow: 0 1px 1px rgba(255,255,255,.75); #gradient > .vertical-three-colors(@white, @white, 25%, darken(@white, 10%)); // Don't use .gradientbar() here since it does a three-color gradient @@ -129,8 +129,9 @@ .border-radius(5px); } &.small { - padding: 7px 9px 7px; + padding: 5px 9px 5px; font-size: @baseFontSize - 2px; + line-height: @baseLineHeight - 2px; } } diff --git a/lib/forms.less b/lib/forms.less index b2bd7b8cc8..4ee636683b 100644 --- a/lib/forms.less +++ b/lib/forms.less @@ -119,7 +119,6 @@ input[type=file] { // Chrome on Linux and Mobile Safari need background-color select { width: 220px; // default input width + 10px of padding that doesn't get applied - vertical-align: baseline; background-color: @white; } @@ -377,9 +376,9 @@ select:focus:required:invalid { } .help-inline { - *position: relative; /* IE6-7 */ - *top: -5px; /* IE6-7 */ - display: inline; + display: inline-block; + margin-bottom: 9px; + vertical-align: middle; padding-left: 5px; } @@ -469,6 +468,7 @@ select:focus:required:invalid { input, textarea, select, + .help-inline, .uneditable-input { display: inline-block; margin-bottom: 0; diff --git a/lib/reset.less b/lib/reset.less index 31e7160f2d..ef4dc8af6c 100644 --- a/lib/reset.less +++ b/lib/reset.less @@ -91,8 +91,7 @@ select, textarea { margin: 0; font-size: 100%; - vertical-align: baseline; - *vertical-align: middle; + vertical-align: middle; } button, input {