2
0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-17 19:21:23 +03:00

Simplify input groups by dropping .input-group-prepend and .input-group-append

This commit is contained in:
Martijn Cuppens
2019-12-19 15:28:40 +01:00
parent 9eccb3a230
commit 85b12549ec
8 changed files with 129 additions and 241 deletions
+3 -9
View File
@@ -232,9 +232,7 @@ The example below uses a flexbox utility to vertically center the contents and c
<div class="col-auto">
<label class="sr-only" for="autoSizingInputGroup">Username</label>
<div class="input-group">
<div class="input-group-prepend">
<div class="input-group-text">@</div>
</div>
<div class="input-group-text">@</div>
<input type="text" class="form-control" id="autoSizingInputGroup" placeholder="Username">
</div>
</div>
@@ -272,9 +270,7 @@ You can then remix that once again with size-specific column classes.
<div class="col-sm-3">
<label class="sr-only" for="specificSizeInputGroupUsername">Username</label>
<div class="input-group">
<div class="input-group-prepend">
<div class="input-group-text">@</div>
</div>
<div class="input-group-text">@</div>
<input type="text" class="form-control" id="specificSizeInputGroupUsername" placeholder="Username">
</div>
</div>
@@ -317,9 +313,7 @@ Be sure to always include a `<label>` with each form control, even if you need t
<div class="col-12">
<label class="sr-only" for="inlineFormInputGroupUsername">Username</label>
<div class="input-group">
<div class="input-group-prepend">
<div class="input-group-text">@</div>
</div>
<div class="input-group-text">@</div>
<input type="text" class="form-control" id="inlineFormInputGroupUsername" placeholder="Username">
</div>
</div>