input checkbox in div jumps to top of page on firefox [closed]

Answer 1

This is happening because you are positioning the checkbox absolutely and -20px above the viewport. When you click on the span, you're triggering the label to change the checkbox which causes the jump to the top. There are a variety of ways to fix this, but an easy one would be to change:

#modbutton label input {
    position:absolute;
    top:-20px;
}

to something like:

#modbutton label input {
    position:absolute;
    left:-20px;
}

jsFiddle example

Answer 2

DEMO

Just need a minor CSS change

#modbutton label input {
    /* position:absolute; */
    /* top:-20px; */
    display:none; /* ADD */
}

Answer 3

I got your point

Please change this code for your input field

<input id="status" type="checkbox" name="displaystaffstatus" style="position: relative;">

or do this thing

#modbutton label input {
    display:none;
}