mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-14 01:24:19 +02:00
Code Issues Releases Wiki Activity

fix broke grid classes

Browse Source
This commit is contained in:
Mark Otto
2013-03-30 01:09:30 -07:00
parent af470f4c7b
commit 1dcadede36
1 changed files with 38 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
docs/docs.html
View File

@@ -1202,8 +1202,8 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<h3 id="forms-inline">Inline form</h3> <h3 id="forms-inline">Inline form</h3>
<p>Add <code>.form-inline</code> for left-aligned labels and inline-block controls for a compact layout.</p> <p>Add <code>.form-inline</code> for left-aligned labels and inline-block controls for a compact layout.</p>
<form class="bs-docs-example form-inline"> <form class="bs-docs-example form-inline">
<input type="text" class="span3" placeholder="Email"> <input type="text" class="col-span-3" placeholder="Email">
<input type="password" class="span3" placeholder="Password"> <input type="password" class="col-span-3" placeholder="Password">
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox"> Remember me <input type="checkbox"> Remember me
@@ -1213,8 +1213,8 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
</form><!-- /example --> </form><!-- /example -->
{% highlight html linenos %} {% highlight html linenos %}
<form class="form-inline"> <form class="form-inline">
<input type="text" class="span3" placeholder="Email"> <input type="text" class="col-span-3" placeholder="Email">
<input type="password" class="span3" placeholder="Password"> <input type="password" class="col-span-3" placeholder="Password">
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox"> Remember me <input type="checkbox"> Remember me
@@ -1426,10 +1426,10 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<p>Style inputs via default browser functionality with <code>:invalid</code>. Specify a <code>type</code>, add the <code>required</code> attribute if the field is not optional, and (if applicable) specify a <code>pattern</code>.</p> <p>Style inputs via default browser functionality with <code>:invalid</code>. Specify a <code>type</code>, add the <code>required</code> attribute if the field is not optional, and (if applicable) specify a <code>pattern</code>.</p>
<p>This is not available in versions of Internet Explorer 7-9 due to lack of support for CSS pseudo selectors.</p> <p>This is not available in versions of Internet Explorer 7-9 due to lack of support for CSS pseudo selectors.</p>
<form class="bs-docs-example form-inline"> <form class="bs-docs-example form-inline">
<input class="span3" type="email" placeholder="test@example.com" required> <input class="col-span-3" type="email" placeholder="test@example.com" required>
</form> </form>
{% highlight html linenos %} {% highlight html linenos %}
<input class="span3" type="email" placeholder="test@example.com" required> <input class="col-span-3" type="email" placeholder="test@example.com" required>
{% endhighlight %} {% endhighlight %}
<h3 id="forms-disabled-inputs">Disabled inputs</h3> <h3 id="forms-disabled-inputs">Disabled inputs</h3>
@@ -1446,10 +1446,10 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<form class="bs-docs-example form-inline"> <form class="bs-docs-example form-inline">
<fieldset disabled> <fieldset disabled>
<div> <div>
<input type="text" class="span4" placeholder="Disabled input"> <input type="text" class="col-span-4" placeholder="Disabled input">
</div> </div>
<div> <div>
<select class="span4"> <select class="col-span-4">
<option>Disabled select</option> <option>Disabled select</option>
</select> </select>
</div> </div>
@@ -1465,10 +1465,10 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<form class="form-inline"> <form class="form-inline">
<fieldset disabled> <fieldset disabled>
<div> <div>
<input type="text" class="span4" placeholder="Disabled input"> <input type="text" class="col-span-4" placeholder="Disabled input">
</div> </div>
<div> <div>
<select class="span4"> <select class="col-span-4">
<option>Disabled select</option> <option>Disabled select</option>
</select> </select>
</div> </div>
@@ -1550,7 +1550,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<span class="input-group-addon">.00</span> <span class="input-group-addon">.00</span>
</div> </div>
<br> <br>
<div class="input-group span3"> <div class="input-group col-span-3">
<span class="input-group-addon">$</span> <span class="input-group-addon">$</span>
<input type="text"> <input type="text">
<span class="input-group-addon">.00</span> <span class="input-group-addon">.00</span>
@@ -1567,7 +1567,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<span class="input-group-addon">.00</span> <span class="input-group-addon">.00</span>
</div> </div>
<div class="input-group span3"> <div class="input-group col-span-3">
<span class="input-group-addon">$</span> <span class="input-group-addon">$</span>
<input type="text"> <input type="text">
<span class="input-group-addon">.00</span> <span class="input-group-addon">.00</span>
@@ -1781,7 +1781,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<div class="controls docs-input-sizes"> <div class="controls docs-input-sizes">
<input class="span1" type="text" placeholder=".span1"> <input class="span1" type="text" placeholder=".span1">
<input class="span2" type="text" placeholder=".span2"> <input class="span2" type="text" placeholder=".span2">
<input class="span3" type="text" placeholder=".span3"> <input class="col-span-3" type="text" placeholder=".col-span-3">
<select class="span1"> <select class="span1">
<option>1</option> <option>1</option>
<option>2</option> <option>2</option>
@@ -1796,7 +1796,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<option>4</option> <option>4</option>
<option>5</option> <option>5</option>
</select> </select>
<select class="span3"> <select class="col-span-3">
<option>1</option> <option>1</option>
<option>2</option> <option>2</option>
<option>3</option> <option>3</option>
@@ -1808,14 +1808,14 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
{% highlight html linenos %} {% highlight html linenos %}
<input class="span1" type="text" placeholder=".span1"> <input class="span1" type="text" placeholder=".span1">
<input class="span2" type="text" placeholder=".span2"> <input class="span2" type="text" placeholder=".span2">
<input class="span3" type="text" placeholder=".span3"> <input class="col-span-3" type="text" placeholder=".col-span-3">
<select class="span1"> <select class="span1">
... ...
</select> </select>
<select class="span2"> <select class="span2">
... ...
</select> </select>
<select class="span3"> <select class="col-span-3">
... ...
</select> </select>
{% endhighlight %} {% endhighlight %}
@@ -1823,27 +1823,27 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<p>If you need multiple inputs on the same line, wrap them in the standard grid markup (with <code>.row</code> and <code>.span*</code> classes). Each input should have it's own column and will expand to fill the available width automatically.</p> <p>If you need multiple inputs on the same line, wrap them in the standard grid markup (with <code>.row</code> and <code>.span*</code> classes). Each input should have it's own column and will expand to fill the available width automatically.</p>
<form class="bs-docs-example" style="padding-bottom: 15px;"> <form class="bs-docs-example" style="padding-bottom: 15px;">
<div class="row"> <div class="row">
<div class="span4"> <div class="col-span-4">
<input type="text" placeholder=".span4"> <input type="text" placeholder=".col-span-4">
</div> </div>
<div class="span4"> <div class="col-span-4">
<input type="text" placeholder=".span4"> <input type="text" placeholder=".col-span-4">
</div> </div>
<div class="span4"> <div class="col-span-4">
<input type="text" placeholder=".span4"> <input type="text" placeholder=".col-span-4">
</div> </div>
</div> </div>
</form> </form>
{% highlight html linenos %} {% highlight html linenos %}
<div class="row"> <div class="row">
<div class="span4"> <div class="col-span-4">
<input type="text" placeholder=".span4"> <input type="text" placeholder=".col-span-4">
</div> </div>
<div class="span4"> <div class="col-span-4">
<input type="text" placeholder=".span4"> <input type="text" placeholder=".col-span-4">
</div> </div>
<div class="span4"> <div class="col-span-4">
<input type="text" placeholder=".span4"> <input type="text" placeholder=".col-span-4">
</div> </div>
</div> </div>
{% endhighlight %} {% endhighlight %}
@@ -3966,22 +3966,22 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<p>By default, Bootstrap's thumbnails are designed to showcase linked images with minimal required markup.</p> <p>By default, Bootstrap's thumbnails are designed to showcase linked images with minimal required markup.</p>
<div class="bs-docs-example"> <div class="bs-docs-example">
<div class="row"> <div class="row">
<div class="span3"> <div class="col-span-3">
<a href="#" class="thumbnail"> <a href="#" class="thumbnail">
<img data-src="holder.js/260x180" alt=""> <img data-src="holder.js/260x180" alt="">
</a> </a>
</div> </div>
<div class="span3"> <div class="col-span-3">
<a href="#" class="thumbnail"> <a href="#" class="thumbnail">
<img data-src="holder.js/260x180" alt=""> <img data-src="holder.js/260x180" alt="">
</a> </a>
</div> </div>
<div class="span3"> <div class="col-span-3">
<a href="#" class="thumbnail"> <a href="#" class="thumbnail">
<img data-src="holder.js/260x180" alt=""> <img data-src="holder.js/260x180" alt="">
</a> </a>
</div> </div>
<div class="span3"> <div class="col-span-3">
<a href="#" class="thumbnail"> <a href="#" class="thumbnail">
<img data-src="holder.js/260x180" alt=""> <img data-src="holder.js/260x180" alt="">
</a> </a>
@@ -3990,7 +3990,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
</div><!-- /.bs-docs-example --> </div><!-- /.bs-docs-example -->
{% highlight html linenos %} {% highlight html linenos %}
<div class="row"> <div class="row">
<div class="span3"> <div class="col-span-3">
<a href="#" class="thumbnail"> <a href="#" class="thumbnail">
<img data-src="holder.js/260x180" alt=""> <img data-src="holder.js/260x180" alt="">
</a> </a>
@@ -4003,7 +4003,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<p>With a bit of extra markup, it's possible to add any kind of HTML content like headings, paragraphs, or buttons into thumbnails.</p> <p>With a bit of extra markup, it's possible to add any kind of HTML content like headings, paragraphs, or buttons into thumbnails.</p>
<div class="bs-docs-example"> <div class="bs-docs-example">
<div class="row"> <div class="row">
<div class="span4"> <div class="col-span-4">
<div class="thumbnail"> <div class="thumbnail">
<img data-src="holder.js/300x200" alt=""> <img data-src="holder.js/300x200" alt="">
<div class="caption"> <div class="caption">
@@ -4013,7 +4013,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
</div> </div>
</div> </div>
</div> </div>
<div class="span4"> <div class="col-span-4">
<div class="thumbnail"> <div class="thumbnail">
<img data-src="holder.js/300x200" alt=""> <img data-src="holder.js/300x200" alt="">
<div class="caption"> <div class="caption">
@@ -4023,7 +4023,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
</div> </div>
</div> </div>
</div> </div>
<div class="span4"> <div class="col-span-4">
<div class="thumbnail"> <div class="thumbnail">
<img data-src="holder.js/300x200" alt=""> <img data-src="holder.js/300x200" alt="">
<div class="caption"> <div class="caption">
@@ -4037,7 +4037,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
</div><!-- /.bs-docs-example --> </div><!-- /.bs-docs-example -->
{% highlight html linenos %} {% highlight html linenos %}
<div class="row"> <div class="row">
<div class="span3"> <div class="col-span-3">
<div class="thumbnail"> <div class="thumbnail">
<img data-src="holder.js/300x200" alt=""> <img data-src="holder.js/300x200" alt="">
<div class="caption"> <div class="caption">
@@ -6076,7 +6076,7 @@ $('.carousel').carousel({
<h2>Example</h2> <h2>Example</h2>
<p>A basic, easily extended plugin for quickly creating elegant typeaheads with any form text input.</p> <p>A basic, easily extended plugin for quickly creating elegant typeaheads with any form text input.</p>
<div class="bs-docs-example" style="background-color: #f5f5f5;"> <div class="bs-docs-example" style="background-color: #f5f5f5;">
<input type="text" class="span3" style="margin: 0 auto;" data-provide="typeahead" data-items="4" data-source='["Alabama","Alaska","Arizona","Arkansas","California","Colorado","Connecticut","Delaware","Florida","Georgia","Hawaii","Idaho","Illinois","Indiana","Iowa","Kansas","Kentucky","Louisiana","Maine","Maryland","Massachusetts","Michigan","Minnesota","Mississippi","Missouri","Montana","Nebraska","Nevada","New Hampshire","New Jersey","New Mexico","New York","North Dakota","North Carolina","Ohio","Oklahoma","Oregon","Pennsylvania","Rhode Island","South Carolina","South Dakota","Tennessee","Texas","Utah","Vermont","Virginia","Washington","West Virginia","Wisconsin","Wyoming"]'> <input type="text" class="col-span-3" style="margin: 0 auto;" data-provide="typeahead" data-items="4" data-source='["Alabama","Alaska","Arizona","Arkansas","California","Colorado","Connecticut","Delaware","Florida","Georgia","Hawaii","Idaho","Illinois","Indiana","Iowa","Kansas","Kentucky","Louisiana","Maine","Maryland","Massachusetts","Michigan","Minnesota","Mississippi","Missouri","Montana","Nebraska","Nevada","New Hampshire","New Jersey","New Mexico","New York","North Dakota","North Carolina","Ohio","Oklahoma","Oregon","Pennsylvania","Rhode Island","South Carolina","South Dakota","Tennessee","Texas","Utah","Vermont","Virginia","Washington","West Virginia","Wisconsin","Wyoming"]'>
</div><!-- /example --> </div><!-- /example -->
{% highlight html linenos %} {% highlight html linenos %}
<input type="text" data-provide="typeahead"> <input type="text" data-provide="typeahead">