JSFiddle - React, Tailwind, and code Playground
by jipexu
HTML
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.bundle.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<h4 class="my-3">
The label element is stylized as display inline-block in reboot.scss
</h1>
<div class="row">
<div class="col-4">
<div class="card mb-3">
<h5 class="card-header"> Sondage </h5>
<div class="card-body">
<form action="pollBooth.php" method="post">
<legend>un mot sans fin</legend>
<div class="mb-3">
<div class="custom-control custom-radio text-danger">
<input class="custom-control-input" type="radio" id="voteID0" name="voteID" value="1">
<label class="custom-control-label" for="voteID0">dddddd ff tt yy kkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkk</label>
</div>
<div class="custom-control custom-radio text-success">
<input class="custom-control-input" type="radio" id="voteID1" name="voteID" value="2">
<label class="custom-control-label d-block" for="voteID1">dddddd ff tt yy kkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkk with d-block applied to the label </label>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="col-4">The label element is stylized as display inline-block in reboot.scss but in this case this doesnt work well ...so how to do ..? In the first case with the custom-control-label is not ok.. in the second case with d-block it's ok ... so the question
do we really need display inline-block for the label ?? </div>
<div class="col-4 bg-light">An other column only to full empty space.An other column only to full empty space.An other column only to full empty space.An other column only to full empty space.An other column only to full...