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

fixes #5055: wrap legend and form elements in fieldset so IE8 styles the legend properly

This commit is contained in:
Mark Otto 2012-10-01 10:42:45 -07:00
parent 32181816f7
commit 085d6d185d
2 changed files with 40 additions and 34 deletions

View File

@ -875,6 +875,7 @@ For example, <code><section></code> should be wrapped as inlin
<h2>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>
<form class="bs-docs-example">
<fieldset>
<legend>Legend</legend>
<label>Label name</label>
<input type="text" placeholder="Type something…">
@ -883,9 +884,11 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
<input type="checkbox"> Check me out
</label>
<button type="submit" class="btn">Submit</button>
</fieldset>
</form>
<pre class="prettyprint linenums">
&lt;form&gt;
&lt;fieldset&gt;
&lt;legend&gt;Legend&lt;/legend&gt;
&lt;label&gt;Label name&lt;/label&gt;
&lt;input type="text" placeholder="Type something…"&gt;
@ -894,6 +897,7 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
&lt;input type="checkbox"&gt; Check me out
&lt;/label&gt;
&lt;button type="submit" class="btn"&gt;Submit&lt;/button&gt;
&lt;/fieldset&gt;
&lt;/form&gt;
</pre>
@ -947,7 +951,6 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
<li>Wrap any associated controls in <code>.controls</code> for proper alignment</li>
</ul>
<form class="bs-docs-example form-horizontal">
<legend>Legend</legend>
<div class="control-group">
<label class="control-label" for="inputEmail">Email</label>
<div class="controls">

View File

@ -812,6 +812,7 @@
<h2>{{_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>
<form class="bs-docs-example">
<fieldset>
<legend>Legend</legend>
<label>{{_i}}Label name{{/i}}</label>
<input type="text" placeholder="{{_i}}Type something…{{/i}}">
@ -820,9 +821,11 @@
<input type="checkbox"> {{_i}}Check me out{{/i}}
</label>
<button type="submit" class="btn">{{_i}}Submit{{/i}}</button>
</fieldset>
</form>{{! /example }}
<pre class="prettyprint linenums">
&lt;form&gt;
&lt;fieldset&gt;
&lt;legend&gt;{{_i}}Legend{{/i}}&lt;/legend&gt;
&lt;label&gt;{{_i}}Label name{{/i}}&lt;/label&gt;
&lt;input type="text" placeholder="{{_i}}Type something…{{/i}}"&gt;
@ -831,6 +834,7 @@
&lt;input type="checkbox"&gt; {{_i}}Check me out{{/i}}
&lt;/label&gt;
&lt;button type="submit" class="btn"&gt;{{_i}}Submit{{/i}}&lt;/button&gt;
&lt;/fieldset&gt;
&lt;/form&gt;
</pre>
@ -884,7 +888,6 @@
<li>{{_i}}Wrap any associated controls in <code>.controls</code> for proper alignment{{/i}}</li>
</ul>
<form class="bs-docs-example form-horizontal">
<legend>Legend</legend>
<div class="control-group">
<label class="control-label" for="inputEmail">{{_i}}Email{{/i}}</label>
<div class="controls">