bulma-switch icon indicating copy to clipboard operation
bulma-switch copied to clipboard

Switch does not fit in line with other bulma elements

Open xtlc opened this issue 1 year ago • 0 comments

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: image

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.

xtlc avatar Nov 15 '23 13:11 xtlc