如何在Prestashop上对齐复选框和标签

Question

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 1

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>