0
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-17 09:52:29 +01:00

commenting out stuff and adding grid test page

This commit is contained in:
Mark Otto 2012-09-07 22:46:35 -07:00
parent 9a39306abe
commit b53da4b6e7
5 changed files with 107 additions and 14 deletions

View File

@ -980,8 +980,8 @@ textarea[class*="span"],
.row-fluid select[class*="span"], .row-fluid select[class*="span"],
.row-fluid textarea[class*="span"], .row-fluid textarea[class*="span"],
.row-fluid .uneditable-input[class*="span"] { .row-fluid .uneditable-input[class*="span"] {
float: none; xmargin-left: 0;
margin-left: 0; xfloat: none;
} }
.input-append input[class*="span"], .input-append input[class*="span"],

View File

@ -872,7 +872,7 @@ For example, <code><section></code> should be wrapped as inlin
<h1>Forms</h1> <h1>Forms</h1>
</div> </div>
<h2>Default styles</h2> <h2 id="forms-default">Default styles</h2>
<p>Individual form controls receive styling, but without any required base class on the <code>&lt;form&gt;</code> or large changes in markup. Results in stacked, left-aligned labels on top of form controls.</p> <p>Individual form controls receive styling, but without any required base class on the <code>&lt;form&gt;</code> or large changes in markup. Results in stacked, left-aligned labels on top of form controls.</p>
<form class="bs-docs-example"> <form class="bs-docs-example">
<legend>Legend</legend> <legend>Legend</legend>
@ -901,7 +901,7 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
<hr class="bs-docs-separator"> <hr class="bs-docs-separator">
<h2>Optional layouts</h2> <h2 id="forms-layouts">Optional layouts</h2>
<p>Included with Bootstrap are three optional form layouts for common use cases.</p> <p>Included with Bootstrap are three optional form layouts for common use cases.</p>
<h3>Search form</h3> <h3>Search form</h3>
@ -998,7 +998,7 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
<hr class="bs-docs-separator"> <hr class="bs-docs-separator">
<h2>Supported form controls</h2> <h2 id="forms-controls">Supported form controls</h2>
<p>Examples of standard form controls supported in an example form layout.</p> <p>Examples of standard form controls supported in an example form layout.</p>
<h3>Inputs</h3> <h3>Inputs</h3>
@ -1120,7 +1120,7 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
<hr class="bs-docs-separator"> <hr class="bs-docs-separator">
<h2>Extending form controls</h2> <h2 id="forms-extending">Extending form controls</h2>
<p>Adding on top of existing browser controls, Bootstrap includes other useful form components.</p> <p>Adding on top of existing browser controls, Bootstrap includes other useful form components.</p>
<h3>Prepended and appended inputs</h3> <h3>Prepended and appended inputs</h3>
@ -1211,7 +1211,7 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
&lt;/form&gt; &lt;/form&gt;
</pre> </pre>
<h3>Control sizing</h3> <h3 id="forms-extending-sizes">Control sizing</h3>
<p>Use relative sizing classes like <code>.input-large</code> or match your inputs to the grid column sizes using <code>.span*</code> classes.</p> <p>Use relative sizing classes like <code>.input-large</code> or match your inputs to the grid column sizes using <code>.span*</code> classes.</p>
<h4>Relative sizing</h4> <h4>Relative sizing</h4>

View File

@ -809,7 +809,7 @@
<h1>{{_i}}Forms{{/i}}</h1> <h1>{{_i}}Forms{{/i}}</h1>
</div> </div>
<h2>{{_i}}Default styles{{/i}}</h2> <h2 id="forms-default">{{_i}}Default styles{{/i}}</h2>
<p>{{_i}}Individual form controls receive styling, but without any required base class on the <code>&lt;form&gt;</code> or large changes in markup. Results in stacked, left-aligned labels on top of form controls.{{/i}}</p> <p>{{_i}}Individual form controls receive styling, but without any required base class on the <code>&lt;form&gt;</code> or large changes in markup. Results in stacked, left-aligned labels on top of form controls.{{/i}}</p>
<form class="bs-docs-example"> <form class="bs-docs-example">
<legend>Legend</legend> <legend>Legend</legend>
@ -838,7 +838,7 @@
<hr class="bs-docs-separator"> <hr class="bs-docs-separator">
<h2>{{_i}}Optional layouts{{/i}}</h2> <h2 id="forms-layouts">{{_i}}Optional layouts{{/i}}</h2>
<p>{{_i}}Included with Bootstrap are three optional form layouts for common use cases.{{/i}}</p> <p>{{_i}}Included with Bootstrap are three optional form layouts for common use cases.{{/i}}</p>
<h3>{{_i}}Search form{{/i}}</h3> <h3>{{_i}}Search form{{/i}}</h3>
@ -935,7 +935,7 @@
<hr class="bs-docs-separator"> <hr class="bs-docs-separator">
<h2>{{_i}}Supported form controls{{/i}}</h2> <h2 id="forms-controls">{{_i}}Supported form controls{{/i}}</h2>
<p>{{_i}}Examples of standard form controls supported in an example form layout.{{/i}}</p> <p>{{_i}}Examples of standard form controls supported in an example form layout.{{/i}}</p>
<h3>{{_i}}Inputs{{/i}}</h3> <h3>{{_i}}Inputs{{/i}}</h3>
@ -1057,7 +1057,7 @@
<hr class="bs-docs-separator"> <hr class="bs-docs-separator">
<h2>{{_i}}Extending form controls{{/i}}</h2> <h2 id="forms-extending">{{_i}}Extending form controls{{/i}}</h2>
<p>{{_i}}Adding on top of existing browser controls, Bootstrap includes other useful form components.{{/i}}</p> <p>{{_i}}Adding on top of existing browser controls, Bootstrap includes other useful form components.{{/i}}</p>
<h3>{{_i}}Prepended and appended inputs{{/i}}</h3> <h3>{{_i}}Prepended and appended inputs{{/i}}</h3>
@ -1148,7 +1148,7 @@
&lt;/form&gt; &lt;/form&gt;
</pre> </pre>
<h3>{{_i}}Control sizing{{/i}}</h3> <h3 id="forms-extending-sizes">{{_i}}Control sizing{{/i}}</h3>
<p>{{_i}}Use relative sizing classes like <code>.input-large</code> or match your inputs to the grid column sizes using <code>.span*</code> classes.{{/i}}</p> <p>{{_i}}Use relative sizing classes like <code>.input-large</code> or match your inputs to the grid column sizes using <code>.span*</code> classes.{{/i}}</p>
<h4>{{_i}}Relative sizing{{/i}}</h4> <h4>{{_i}}Relative sizing{{/i}}</h4>

View File

@ -275,8 +275,8 @@ textarea[class*="span"],
.row-fluid select[class*="span"], .row-fluid select[class*="span"],
.row-fluid textarea[class*="span"], .row-fluid textarea[class*="span"],
.row-fluid .uneditable-input[class*="span"] { .row-fluid .uneditable-input[class*="span"] {
float: none; xfloat: none;
margin-left: 0; xmargin-left: 0;
} }
// Ensure input-prepend/append never wraps // Ensure input-prepend/append never wraps
.input-append input[class*="span"], .input-append input[class*="span"],

93
less/tests/grid.html Normal file
View File

@ -0,0 +1,93 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Bootstrap</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<!-- Le styles -->
<link href="../../docs/assets/css/bootstrap.css" rel="stylesheet">
<link href="../../docs/assets/css/bootstrap-responsive.css" rel="stylesheet">
<link href="../../docs/assets/css/docs.css" rel="stylesheet">
<style>
body {
padding-top: 30px;
padding-bottom: 30px;
}
</style>
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- Le fav and touch icons -->
<link rel="shortcut icon" href="../../docs/assets/ico/favicon.ico">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="../../docs/assets/ico/apple-touch-icon-144-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="../../docs/assets/ico/apple-touch-icon-114-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="../../docs/assets/ico/apple-touch-icon-72-precomposed.png">
<link rel="apple-touch-icon-precomposed" href="../../docs/assets/ico/apple-touch-icon-57-precomposed.png">
</head>
<body>
<form class="container">
<div class="page-header">
<h1>Grids</h1>
</div>
<h2>Default grid columns</h2>
<div class="bs-docs-grid">
<div class="row show-grid">
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
</div>
<div class="row show-grid">
<div class="span4">4</div>
<div class="span4">4</div>
<div class="span4">4</div>
</div>
<div class="row show-grid">
<div class="span6">6</div>
<div class="span6">6</div>
</div>
<div class="row show-grid">
<div class="span12">12</div>
</div>
</div>
<h2>Inputs</h2>
<h4>No additional markup</h4>
<input type="text" class="span4" placeholder=".span4">
<input type="text" class="span4" placeholder=".span4">
<input type="text" class="span4" placeholder=".span4">
<h4>With .controls-row</h4>
<div class="controls-row">
<input type="text" class="span4" placeholder=".span4">
<input type="text" class="span4" placeholder=".span4">
<input type="text" class="span4" placeholder=".span4">
</div>
</form> <!-- /container -->
</body>
</html>