bulma-switch
bulma-switch copied to clipboard
Switch does not fit in line with other bulma elements
Possibly related: https://github.com/Wikiki/bulma-switch/issues/72
I have a problem aligning the switch in a line with another bulma (input) element:
<div class="column is-one-quarter">
<div class="field">
<label class="label">a1</label>
<div class="control">
<div class="select">
<select name="a1" id="a1Field" required>
<option value="" disabled selected value>Please Choose...</option>
<option value="...." > ... </option>
</select>
</div>
</div>
</div>
</div>
<div class="column is-one-quarter">
<label class="label">a2</label>
<div class="field">
<input id="a2Switch" type="checkbox" name="a2Switch" class="switch is-outlined is-danger is-large">
<label for="a2Switch" id="a2SwitchLabel" class="has-text-info">on</label>
</div>
</div>
this results in:
and the different hights are easier to spot, but also the switch starts "higher" already and does not vertically align with the input next to it.