为什么复选框与标签不一致?
What I get
<div class="row g-1 border-bottom p-3">
<div class="col border-end justify-content-center d-flex align-items-center">
<div class="h6 text-sm-center h-25">
osiągniecia
</div>
</div>
<div class="col ps-3">
<div class="form-check">
<input type="checkbox" name="wyroznienie" id="wyroznienie">
<label for="wyroznienie">
Świadectwo ukończenia szkoły podstawowej z wyróżnieniem
</label>
</div>
<div class="form-check">
<input type="checkbox" name="wyroznienie2" id="wyroznienie2">
<label for="wyroznienienie2">
Osiągnięcia w zakresie aktywności społecznej, w tym na rzecz środowiska szkolnego, w szczególności w formie wolontariatu
</label>
</div>
</div>
</div>
我需要复选框与其标签一致。
2条答案
按热度按时间gpfsuwkq1#
使用适当的复选框类:
form-check-input
和form-check-label
。请参见documentation。
cuxqih212#
在
.form-check
中使用display: flex
。添加一些margin to the input
和padding to the label
演示