Form control feedback not working with stacked custom controls
Created by: omnibrain
When using form control feedback with stacked custom controls, the form feedback will just float on the right of the first custom control element.
In fact every block element following the div with the .custom-controls-stacked
class will just float right of the first radio button or checkbox label, so also if you have a <p>
element after the stacked radios, it will be completely misplaced (see screenshot below).
Screenshot:
Code:
<div class="m-3 form-group has-success">
<div class="custom-controls-stacked">
<label class="custom-control custom-radio">
<input id="radioStacked1" name="radio-stacked" type="radio" class="custom-control-input">
<span class="custom-control-indicator"></span>
<span class="custom-control-description">I'm a radio button label</span>
</label>
<label class="custom-control custom-radio">
<input id="radioStacked2" name="radio-stacked" type="radio" class="custom-control-input">
<span class="custom-control-indicator"></span>
<span class="custom-control-description">I'm another label</span>
</label>
</div>
<p>I'm a paragraph below the stacked radio inputs</p>
</div>