mercredi 22 février 2017

checkbox zooming behaviour after ajax submission

I have a couple of checkboxes that behave strange after submitting the form and appending to the html via ajax more html.

OS: Mac browser: firefox, chrome and safari all same problem

I have tried defining the size of the checkboxes with css:

 input[type="checkbox"] {
width: 15px; /*Tiny checkbox to avoid big boxes in firefox*/
height: 15px;
cursor: pointer;
}

                <div class="checkbox">
                    <label>
                        <input type="checkbox" name="checkbox1" value="1"
                               required="">
                        checkbox1
                    </label>
                </div>
                <div class="checkbox">
                    <label>
                        <input type="checkbox" name="checkbox2" value="2"
                               required="">

                    </label>
                </div>
                <div class="checkbox">
                    <label>
                        <input type="checkbox" name="checkbox3" value="3"
                               required="">

                    </label>
                </div>

so the checkboxes look like the next image

enter image description here

but when i submit the form the automatically kind of zoom and expand to this:

enter image description here

Any idea what can be? Because the size automatically doubles from 15 to 30, that is the problem.

Thank you in advance,




Aucun commentaire:

Enregistrer un commentaire