</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>
<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>