mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-23 05:33:02 +02:00
Code Issues Releases Wiki Activity

docs(forms): backport #31904

Browse Source 
* docs(forms): use a legend for fieldset instead of aria-label

* docs(forms): fix incorrect legend nesting in fieldset
This commit is contained in:
Gaël Poupard
2020-10-19 11:21:33 +02:00
committed by XhmikosR
parent cec8e5ddc3
commit 5f3fa833c9
1 changed files with 22 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
site/docs/4.5/components/forms.md
View File

@@ -400,34 +400,31 @@ At times, you maybe need to use margin or padding utilities to create that perfe
<input type="password" class="form-control" id="inputPassword3"> <input type="password" class="form-control" id="inputPassword3">
</div> </div>
</div> </div>
<fieldset class="form-group"> <fieldset class="form-group row">
<div class="row"> <legend class="col-form-label col-sm-2 float-sm-left pt-0">Radios</legend>
<legend class="col-form-label col-sm-2 pt-0">Radios</legend> <div class="col-sm-10">
<div class="col-sm-10"> <div class="form-check">
<div class="form-check"> <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios1" value="option1" checked>
<input class="form-check-input" type="radio" name="gridRadios" id="gridRadios1" value="option1" checked> <label class="form-check-label" for="gridRadios1">
<label class="form-check-label" for="gridRadios1"> First radio
First radio </label>
</label> </div>
</div> <div class="form-check">
<div class="form-check"> <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios2" value="option2">
<input class="form-check-input" type="radio" name="gridRadios" id="gridRadios2" value="option2"> <label class="form-check-label" for="gridRadios2">
<label class="form-check-label" for="gridRadios2"> Second radio
Second radio </label>
</label> </div>
</div> <div class="form-check disabled">
<div class="form-check disabled"> <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios3" value="option3" disabled>
<input class="form-check-input" type="radio" name="gridRadios" id="gridRadios3" value="option3" disabled> <label class="form-check-label" for="gridRadios3">
<label class="form-check-label" for="gridRadios3"> Third disabled radio
Third disabled radio </label>
</label>
</div>
</div> </div>
</div> </div>
</fieldset> </fieldset>
<div class="form-group row"> <div class="form-group row">
<div class="col-sm-2">Checkbox</div> <div class="col-sm-10 offset-sm-2">
<div class="col-sm-10">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" id="gridCheck1"> <input class="form-check-input" type="checkbox" id="gridCheck1">
<label class="form-check-label" for="gridCheck1"> <label class="form-check-label" for="gridCheck1">
@@ -705,6 +702,7 @@ Add the `disabled` attribute to a `<fieldset>` to disable all the controls withi
{% capture example %} {% capture example %}
<form> <form>
<fieldset disabled> <fieldset disabled>
<legend>Disabled fieldset example</legend>
<div class="form-group"> <div class="form-group">
<label for="disabledTextInput">Disabled input</label> <label for="disabledTextInput">Disabled input</label>
<input type="text" id="disabledTextInput" class="form-control" placeholder="Disabled input"> <input type="text" id="disabledTextInput" class="form-control" placeholder="Disabled input">