aboutsummaryrefslogtreecommitdiff
path: root/docs
diff options
context:
space:
mode:
authorMark Otto <[email protected]>2017-10-29 11:46:26 -0700
committerMark Otto <[email protected]>2017-10-29 11:46:26 -0700
commitdfd52291672fc090f06d6689e4aeb658ab9ca129 (patch)
tree523b95a1a5fc79da80e9076b30ef5846fa651539 /docs
parentfceffd16c077efb1cffedd54d27c9fd40ba24b38 (diff)
parent63828f0cf06ddd08bc8eed439d6d470a002b4613 (diff)
downloadbootstrap-dfd52291672fc090f06d6689e4aeb658ab9ca129.tar.xz
bootstrap-dfd52291672fc090f06d6689e4aeb658ab9ca129.zip
Merge branch 'v4-dev' of https://github.com/jipexu/bootstrap into jipexu-v4-dev
Diffstat (limited to 'docs')
-rw-r--r--docs/4.0/components/forms.md34
1 files changed, 17 insertions, 17 deletions
diff --git a/docs/4.0/components/forms.md b/docs/4.0/components/forms.md
index abf6c1e67..dbfbe0409 100644
--- a/docs/4.0/components/forms.md
+++ b/docs/4.0/components/forms.md
@@ -138,15 +138,15 @@ If you want to have `<input readonly>` elements in your form styled as plain tex
{% example html %}
<form class="form-inline">
- <div class="form-group">
+ <div class="form-group mb-2">
<label for="staticEmail2" class="sr-only">Email</label>
<input type="text" readonly class="form-control-plaintext" id="staticEmail2" value="[email protected]">
</div>
- <div class="form-group mx-sm-3">
+ <div class="form-group mx-sm-3 mb-2">
<label for="inputPassword2" class="sr-only">Password</label>
<input type="password" class="form-control" id="inputPassword2" placeholder="Password">
</div>
- <button type="submit" class="btn btn-primary">Confirm identity</button>
+ <button type="submit" class="btn btn-primary mb-2">Confirm identity</button>
</form>
{% endexample %}
@@ -477,24 +477,24 @@ The example below uses a flexbox utility to vertically center the contents and c
<div class="form-row align-items-center">
<div class="col-auto">
<label class="sr-only" for="inlineFormInput">Name</label>
- <input type="text" class="form-control mb-2 mb-sm-0" id="inlineFormInput" placeholder="Jane Doe">
+ <input type="text" class="form-control mb-2" id="inlineFormInput" placeholder="Jane Doe">
</div>
<div class="col-auto">
<label class="sr-only" for="inlineFormInputGroup">Username</label>
- <div class="input-group mb-2 mb-sm-0">
+ <div class="input-group mb-2">
<div class="input-group-addon">@</div>
<input type="text" class="form-control" id="inlineFormInputGroup" placeholder="Username">
</div>
</div>
<div class="col-auto">
- <div class="form-check mb-2 mb-sm-0">
+ <div class="form-check mb-2">
<label class="form-check-label">
<input class="form-check-input" type="checkbox"> Remember me
</label>
</div>
</div>
<div class="col-auto">
- <button type="submit" class="btn btn-primary">Submit</button>
+ <button type="submit" class="btn btn-primary mb-2">Submit</button>
</div>
</div>
</form>
@@ -537,7 +537,7 @@ And of course [custom form controls](#custom-forms) are supported.
<div class="form-row align-items-center">
<div class="col-auto">
<label class="mr-sm-2" for="inlineFormCustomSelect">Preference</label>
- <select class="custom-select mb-2 mr-sm-2 mb-sm-0" id="inlineFormCustomSelect">
+ <select class="custom-select mb-2 mr-sm-2" id="inlineFormCustomSelect">
<option selected>Choose...</option>
<option value="1">One</option>
<option value="2">Two</option>
@@ -545,14 +545,14 @@ And of course [custom form controls](#custom-forms) are supported.
</select>
</div>
<div class="col-auto">
- <label class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
+ <label class="custom-control custom-checkbox mb-2 mr-sm-2">
<input type="checkbox" class="custom-control-input">
<span class="custom-control-indicator"></span>
<span class="custom-control-description">Remember my preference</span>
</label>
</div>
<div class="col-auto">
- <button type="submit" class="btn btn-primary">Submit</button>
+ <button type="submit" class="btn btn-primary mb-2">Submit</button>
</div>
</div>
</form>
@@ -571,21 +571,21 @@ You may need to manually address the width and alignment of individual form cont
{% example html %}
<form class="form-inline">
<label class="sr-only" for="inlineFormInputName2">Name</label>
- <input type="text" class="form-control mb-2 mr-sm-2 mb-sm-0" id="inlineFormInputName2" placeholder="Jane Doe">
+ <input type="text" class="form-control mb-2 mr-sm-2" id="inlineFormInputName2" placeholder="Jane Doe">
<label class="sr-only" for="inlineFormInputGroupUsername2">Username</label>
- <div class="input-group mb-2 mr-sm-2 mb-sm-0">
+ <div class="input-group mb-2 mr-sm-2">
<div class="input-group-addon">@</div>
<input type="text" class="form-control" id="inlineFormInputGroupUsername2" placeholder="Username">
</div>
- <div class="form-check mb-2 mr-sm-2 mb-sm-0">
+ <div class="form-check mb-2 mr-sm-2">
<label class="form-check-label">
<input class="form-check-input" type="checkbox"> Remember me
</label>
</div>
- <button type="submit" class="btn btn-primary">Submit</button>
+ <button type="submit" class="btn btn-primary mb-2">Submit</button>
</form>
{% endexample %}
@@ -594,20 +594,20 @@ Custom form controls and selects are also supported.
{% example html %}
<form class="form-inline">
<label class="mr-sm-2" for="inlineFormCustomSelectPref">Preference</label>
- <select class="custom-select mb-2 mr-sm-2 mb-sm-0" id="inlineFormCustomSelectPref">
+ <select class="custom-select mb-2 mr-sm-2" id="inlineFormCustomSelectPref">
<option selected>Choose...</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
- <label class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
+ <label class="custom-control custom-checkbox mb-2 mr-sm-2">
<input type="checkbox" class="custom-control-input">
<span class="custom-control-indicator"></span>
<span class="custom-control-description">Remember my preference</span>
</label>
- <button type="submit" class="btn btn-primary">Submit</button>
+ <button type="submit" class="btn btn-primary mb-2">Submit</button>
</form>
{% endexample %}