diff options
author | Mark Otto <markotto@twitter.com> | 2012-10-01 21:42:45 +0400 |
---|---|---|
committer | Mark Otto <markotto@twitter.com> | 2012-10-01 21:42:45 +0400 |
commit | 085d6d185d7695d0816315aeee5e3a8ed3c60585 (patch) | |
tree | 788f4e24ecd1f5a30fbedf3c6db9cd38a600b01d | |
parent | 32181816f714b1e9ed83a925b6334efca3cbd5ff (diff) |
fixes #5055: wrap legend and form elements in fieldset so IE8 styles the legend properly
-rw-r--r-- | docs/base-css.html | 37 | ||||
-rw-r--r-- | docs/templates/pages/base-css.mustache | 37 |
2 files changed, 40 insertions, 34 deletions
diff --git a/docs/base-css.html b/docs/base-css.html index 1f0a039f07..46ce606cbb 100644 --- a/docs/base-css.html +++ b/docs/base-css.html @@ -875,25 +875,29 @@ 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><form></code> or large changes in markup. Results in stacked, left-aligned labels on top of form controls.</p> <form class="bs-docs-example"> - <legend>Legend</legend> - <label>Label name</label> - <input type="text" placeholder="Type something…"> - <span class="help-block">Example block-level help text here.</span> - <label class="checkbox"> - <input type="checkbox"> Check me out - </label> - <button type="submit" class="btn">Submit</button> + <fieldset> + <legend>Legend</legend> + <label>Label name</label> + <input type="text" placeholder="Type something…"> + <span class="help-block">Example block-level help text here.</span> + <label class="checkbox"> + <input type="checkbox"> Check me out + </label> + <button type="submit" class="btn">Submit</button> + </fieldset> </form> <pre class="prettyprint linenums"> <form> - <legend>Legend</legend> - <label>Label name</label> - <input type="text" placeholder="Type something…"> - <span class="help-block">Example block-level help text here.</span> - <label class="checkbox"> - <input type="checkbox"> Check me out - </label> - <button type="submit" class="btn">Submit</button> + <fieldset> + <legend>Legend</legend> + <label>Label name</label> + <input type="text" placeholder="Type something…"> + <span class="help-block">Example block-level help text here.</span> + <label class="checkbox"> + <input type="checkbox"> Check me out + </label> + <button type="submit" class="btn">Submit</button> + </fieldset> </form> </pre> @@ -947,7 +951,6 @@ For example, <code><section></code> 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"> diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache index 13192d90e1..9e0a899525 100644 --- a/docs/templates/pages/base-css.mustache +++ b/docs/templates/pages/base-css.mustache @@ -812,25 +812,29 @@ <h2>{{_i}}Default styles{{/i}}</h2> <p>{{_i}}Individual form controls receive styling, but without any required base class on the <code><form></code> or large changes in markup. Results in stacked, left-aligned labels on top of form controls.{{/i}}</p> <form class="bs-docs-example"> - <legend>Legend</legend> - <label>{{_i}}Label name{{/i}}</label> - <input type="text" placeholder="{{_i}}Type something…{{/i}}"> - <span class="help-block">{{_i}}Example block-level help text here.{{/i}}</span> - <label class="checkbox"> - <input type="checkbox"> {{_i}}Check me out{{/i}} - </label> - <button type="submit" class="btn">{{_i}}Submit{{/i}}</button> + <fieldset> + <legend>Legend</legend> + <label>{{_i}}Label name{{/i}}</label> + <input type="text" placeholder="{{_i}}Type something…{{/i}}"> + <span class="help-block">{{_i}}Example block-level help text here.{{/i}}</span> + <label class="checkbox"> + <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"> <form> - <legend>{{_i}}Legend{{/i}}</legend> - <label>{{_i}}Label name{{/i}}</label> - <input type="text" placeholder="{{_i}}Type something…{{/i}}"> - <span class="help-block">Example block-level help text here.</span> - <label class="checkbox"> - <input type="checkbox"> {{_i}}Check me out{{/i}} - </label> - <button type="submit" class="btn">{{_i}}Submit{{/i}}</button> + <fieldset> + <legend>{{_i}}Legend{{/i}}</legend> + <label>{{_i}}Label name{{/i}}</label> + <input type="text" placeholder="{{_i}}Type something…{{/i}}"> + <span class="help-block">Example block-level help text here.</span> + <label class="checkbox"> + <input type="checkbox"> {{_i}}Check me out{{/i}} + </label> + <button type="submit" class="btn">{{_i}}Submit{{/i}}</button> + </fieldset> </form> </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"> |