The margin right should apply to the checkbox itself to create a
gap between the pseudo element checkbox and the label.
The existing setup causes rendering issues on io8 and is unnecessary
here. The purpose is to create a space for the checkbox. margin-right
doesn't make any difference to an absolutely positioned element and applying
margins to the label interferes with the pseudo elements themselves.
Bug: 72727
Change-Id: I72af4a53e22b1adb3a70af85f5453a1bc9830eb9
height: @checkboxSize;
// This is needed for Firefox mobile (See bug 71750 to workaround default Firefox stylesheet)
max-width: none;
+ margin-right: .4em;
// the pseudo before element of the label after the checkbox now looks like a checkbox
& + label {
cursor: pointer;
- margin: 0 0.4em;
&::before {
content: '';