Using input groups (with addons) together with help-text in Bootstrap 4

问题

I'm having a hard time getting Help-texts showing up properly (i.e. at the bottom of the field) with Bootstrap 4's input-groups with add-ons. Here's my code:

<div class="input-group mb-3">
    <div class="input-group-prepend">
        <span class="input-group-text">Title</span>
    </div>
    <textarea class="form-control" name="title" aria-label="With textarea"></textarea>
    <small id="KeywordsHelpBlock" class="input-group-prepend text-muted">
        Some .
    </small>
</div>

Here is what it looks like:

Am I missing something obvious?

回答1:

This has been an issue in Bootstrap 4 for some time. The only way I've found is to add an 100% width empty span to force the wrap...

https://www.codeply.com/go/Rw1ZPnwIcS

<div class="input-group mb-3">
    <div class="input-group-prepend">
        <span class="input-group-text">Title</span>
    </div>
    <textarea class="form-control" name="title" aria-label="With textarea"></textarea>
    <span class="w-100"></span>
    <small id="KeywordsHelpBlock" class=" text-muted">
        Some .
    </small>
</div>

来源：https://stackoverflow.com/questions/48996400/using-input-groups-with-addons-together-with-help-text-in-bootstrap-4