Kilian Kilian - 5 months ago 142
Smarty Question

How to align checkbox and label on prestashop


Hi, I'm working on a prestashop module, and I want to align a checkbox with a label in a smarty template.


I try this for exemple :

<input id="Checkbox1" name="Checkbox1" type="checkbox" value="Admin" />
<label for="Checkbox1">test</label>



But on my navigator the label is under the checkbox, and in HTML source, I see a
div
around my
checkbox
.

<div class="checker" id="uniform-Checkbox1"><span><input id="Checkbox1" name="Checkbox1" value="Admin" type="checkbox"></span></div>
<label for="Checkbox1">test</label>




This code run perfectly in a classic HTML page.
Thanks for help.
I use Prestashop 1.6.1.4 in a docker environment.

Answer Source

Paste following css in your custom css file:

.checker,
.checker+label {
  display: inline-block;
  vertical-align: middle;
}

.checker,
.checker+label {
  display: inline-block;
  vertical-align: middle;
}
<div class="checker" id="uniform-Checkbox1"><span><input id="Checkbox1" name="Checkbox1" value="Admin" type="checkbox"></span></div>
<label for="Checkbox1">test</label>

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download