Open jonathanconway opened 7 years ago
Here is a simple override which should work:
// A fix for long labels on checkboxes and radios
form {
input[type='radio']+label,
input[type='checkbox']+label {
position: relative;
}
input[type='checkbox']{
&:checked {
&:after {
float: none !important;
margin-left: 0 !important;
margin-top: 0 !important;
position: absolute;
top: 5px !important;
left: 5px;
}
}
}
}
Bug - Radio buttons and checkboxes break when label text wraps (e.g. on a mobile display)
What I did
I built a radio-button-list, using markup similar to the following:
What browser and device I was using
Chrome, MacOS 10.12.3
What I expected to see
The little black dot inside the circle.
What I saw
The little black dot outside the circle.