From 7875e4833cb7d00db2967078fd6f51adbfd4a351 Mon Sep 17 00:00:00 2001
From: Mark Otto <markotto@twitter.com>
Date: Mon, 28 May 2012 17:32:24 -0700
Subject: [PATCH] fix broken css tests, add fluid input-prepend/-append to
tests, fix input-prepend/append for responsive for both fluid and fixed
sizing
---
docs/assets/css/bootstrap-responsive.css | 4 --
docs/assets/css/bootstrap.css | 9 +++
less/forms.less | 9 +++
less/responsive-767px-max.less | 4 --
less/tests/css-tests.html | 71 ++++++++++++++++--------
5 files changed, 65 insertions(+), 32 deletions(-)
diff --git a/docs/assets/css/bootstrap-responsive.css b/docs/assets/css/bootstrap-responsive.css
index a5d9ff4267..cf8aa011c4 100644
--- a/docs/assets/css/bootstrap-responsive.css
+++ b/docs/assets/css/bootstrap-responsive.css
@@ -174,10 +174,6 @@
width: auto;
margin-left: 0;
}
- .row-fluid .input-prepend [class*="span"],
- .row-fluid .input-append [class*="span"] {
- display: inline-block;
- }
.input-large,
.input-xlarge,
.input-xxlarge,
diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index e3708c29d3..c5f52ebcfd 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -982,6 +982,15 @@ textarea[class*="span"],
margin-left: 0;
}
+.input-append input[class*="span"],
+.input-append .uneditable-input[class*="span"],
+.input-prepend input[class*="span"],
+.input-prepend .uneditable-input[class*="span"],
+.row-fluid .input-prepend [class*="span"],
+.row-fluid .input-append [class*="span"] {
+ display: inline-block;
+}
+
input,
textarea,
.uneditable-input {
diff --git a/less/forms.less b/less/forms.less
index a7e525a761..1163fe9140 100644
--- a/less/forms.less
+++ b/less/forms.less
@@ -245,6 +245,15 @@ textarea[class*="span"],
float: none;
margin-left: 0;
}
+// Ensure input-prepend/append never wraps
+.input-append input[class*="span"],
+.input-append .uneditable-input[class*="span"],
+.input-prepend input[class*="span"],
+.input-prepend .uneditable-input[class*="span"],
+.row-fluid .input-prepend [class*="span"],
+.row-fluid .input-append [class*="span"] {
+ display: inline-block;
+}
diff --git a/less/responsive-767px-max.less b/less/responsive-767px-max.less
index fc422d3a25..614c6905c2 100644
--- a/less/responsive-767px-max.less
+++ b/less/responsive-767px-max.less
@@ -124,10 +124,6 @@
width: auto;
margin-left: 0;
}
- .row-fluid .input-prepend [class*="span"],
- .row-fluid .input-append [class*="span"] {
- display: inline-block;
- }
// FORM FIELDS
// -----------
diff --git a/less/tests/css-tests.html b/less/tests/css-tests.html
index 0e964e27f4..b7177e5c68 100644
--- a/less/tests/css-tests.html
+++ b/less/tests/css-tests.html
@@ -500,68 +500,91 @@
</div><!--/span-->
</div><!--/row-->
+<h4>Fluid prepended and appended inputs</h4>
+<div class="row-fluid">
+ <div class="span6">
+ <form>
+ <div class="controls">
+ <div class="input-prepend">
+ <span class="add-on">@</span><input class="span2" id="prependedInput" size="16" type="text">
+ </div>
+ </div>
+ <div class="controls">
+ <div class="input-append">
+ <input class="span2" id="prependedInput" size="16" type="text"><span class="add-on">@</span>
+ </div>
+ </div>
+ <div class="controls">
+ <div class="input-prepend input-append">
+ <span class="add-on">$</span><input class="span2" id="prependedInput" size="16" type="text"><span class="add-on">.00</span>
+ </div>
+ </div>
+ </form>
+ </div>
+</div>
+
<h4>Fixed row with inputs</h4>
<p>Inputs should not extend past the light red background, set on their parent, a <code>.span*</code> column.</p>
<div class="rowInputs">
<div class="row">
<div class="span12">
- <input class="span1" placeholder="span1">
+ <input type="text" class="span1" placeholder="span1">
</div><!--/span-->
</div><!--/row-->
<div class="row">
<div class="span12">
- <input class="span2" placeholder="span2">
+ <input type="text" class="span2" placeholder="span2">
</div><!--/span-->
</div><!--/row-->
<div class="row">
<div class="span12">
- <input class="span3" placeholder="span3">
+ <input type="text" class="span3" placeholder="span3">
</div><!--/span-->
</div><!--/row-->
<div class="row">
<div class="span12">
- <input class="span4" placeholder="span4">
+ <input type="text" class="span4" placeholder="span4">
</div><!--/span-->
</div><!--/row-->
<div class="row">
<div class="span12">
- <input class="span5" placeholder="span5">
+ <input type="text" class="span5" placeholder="span5">
</div><!--/span-->
</div><!--/row-->
<div class="row">
<div class="span12">
- <input class="span6" placeholder="span6">
+ <input type="text" class="span6" placeholder="span6">
</div><!--/span-->
</div><!--/row-->
<div class="row">
<div class="span12">
- <input class="span7" placeholder="span7">
+ <input type="text" class="span7" placeholder="span7">
</div><!--/span-->
</div><!--/row-->
<div class="row">
<div class="span12">
- <input class="span8" placeholder="span8">
+ <input type="text" class="span8" placeholder="span8">
</div><!--/span-->
</div><!--/row-->
<div class="row">
<div class="span12">
- <input class="span9" placeholder="span9">
+ <input type="text" class="span9" placeholder="span9">
</div><!--/span-->
</div><!--/row-->
<div class="row">
<div class="span12">
- <input class="span10" placeholder="span10">
+ <input type="text" class="span10" placeholder="span10">
</div><!--/span-->
</div><!--/row-->
<div class="row">
<div class="span12">
- <input class="span11" placeholder="span11">
+ <input type="text" class="span11" placeholder="span11">
</div><!--/span-->
</div><!--/row-->
<div class="row">
<div class="span12">
- <input class="span12" placeholder="span12">
+ <input type="text" class="span12" placeholder="span12">
</div><!--/span-->
</div><!--/row-->
</div>
@@ -572,62 +595,62 @@
<div id="fluidRowInputs">
<div class="row-fluid">
<div class="span12">
- <input class="span1" placeholder="span1">
+ <input type="text" class="span1" placeholder="span1">
</div><!--/span-->
</div><!--/row-->
<div class="row-fluid">
<div class="span12">
- <input class="span2" placeholder="span2">
+ <input type="text" class="span2" placeholder="span2">
</div><!--/span-->
</div><!--/row-->
<div class="row-fluid">
<div class="span12">
- <input class="span3" placeholder="span3">
+ <input type="text" class="span3" placeholder="span3">
</div><!--/span-->
</div><!--/row-->
<div class="row-fluid">
<div class="span12">
- <input class="span4" placeholder="span4">
+ <input type="text" class="span4" placeholder="span4">
</div><!--/span-->
</div><!--/row-->
<div class="row-fluid">
<div class="span12">
- <input class="span5" placeholder="span5">
+ <input type="text" class="span5" placeholder="span5">
</div><!--/span-->
</div><!--/row-->
<div class="row-fluid">
<div class="span12">
- <input class="span6" placeholder="span6">
+ <input type="text" class="span6" placeholder="span6">
</div><!--/span-->
</div><!--/row-->
<div class="row-fluid">
<div class="span12">
- <input class="span7" placeholder="span7">
+ <input type="text" class="span7" placeholder="span7">
</div><!--/span-->
</div><!--/row-->
<div class="row-fluid">
<div class="span12">
- <input class="span8" placeholder="span8">
+ <input type="text" class="span8" placeholder="span8">
</div><!--/span-->
</div><!--/row-->
<div class="row-fluid">
<div class="span12">
- <input class="span9" placeholder="span9">
+ <input type="text" class="span9" placeholder="span9">
</div><!--/span-->
</div><!--/row-->
<div class="row-fluid">
<div class="span12">
- <input class="span10" placeholder="span10">
+ <input type="text" class="span10" placeholder="span10">
</div><!--/span-->
</div><!--/row-->
<div class="row-fluid">
<div class="span12">
- <input class="span11" placeholder="span11">
+ <input type="text" class="span11" placeholder="span11">
</div><!--/span-->
</div><!--/row-->
<div class="row-fluid">
<div class="span12">
- <input class="span12" placeholder="span12">
+ <input type="text" class="span12" placeholder="span12">
</div><!--/span-->
</div><!--/row-->
</div>
--
GitLab