IE - Radio button checked with styles makes the page scrolling down - html

Question

I am encountering a problem with a radio button in IE 11.
I have a simple radio button that makes my content scroll down once checked.
Without any styles applied, there is no problem. But with, the problem is back.
Does it have something to do with the IE render engine?
.switch {
position: relative;
display: block;
width: 34px;
height: 18px;
border-radius: 8px;
cursor: pointer;
outline: 0;
height: 18px;
top: 5px;
background-color: $grey-light;
box-shadow: $switch-shadow;
&::before {
content: " ";
position: absolute;
left: 2px;
top: 2px;
border-radius: 50%;
margin: 0;
outline: none;
height: 14px;
width: 14px;
background: white;
transition: background-color .08s ease-in;
}
&.active::before {
background-color: $green-dark;
left: 18px;
transition: background-color .08s ease-in, left .08s ease-in;
}
&.inactive::before {
background-color: $grey-dark;
left: 2px;
transition: background-color .08s ease-in, left .08s ease-in;
}
input[type=checkbox] {
// display: none;
visibility: hidden;
position: absolute;
z-index: -1;
}
}
Thanks for your help!
EDIT.
I forgot to precise that the scrolling box (flex: 1) has a parent which has display: flex.