@mixin checkboxes {
	input[type='radio'],
    input[type='checkbox'] {
        opacity: 0;
        float: left;
        width: 0;

        & + label {
            margin: 0;
            clear: none;
            padding: 5px 0 8px 28px;
            font-size: 1.3rem;
            font-weight: 600;
            line-height: 1.6rem;
            color: $main-text-color;
            cursor: pointer;
            background: url(/static/img/off.png) left 3px no-repeat;
        }
        &.disabled + label {
            opacity: 0.4;
            cursor: default;
        }

        @include select-none;
	}
    input[type='radio']:checked + label {
        background-image: url(/static/img/radio.png);
    }
    input[type='checkbox']:checked + label {
        background-image: url(/static/img/check.png);
    }
}

@mixin checkboxes {
    input[type='radio'],
    input[type='checkbox'] {
        opacity: 0;
        position: absolute;
        width: 0;

        & + label {
            margin: 0;
            clear: none;
            padding: 5px 0 8px 28px;
            font-size: 1.3rem;
            font-weight: 600;
            line-height: 1.6rem;
            color: $main-text-color;
            cursor: pointer;
            background: url(/static/img/off.png) left 3px no-repeat;
        }
        &.disabled + label {
            opacity: 0.4;
            cursor: default;
        }

        @include select-none;
    }
    input[type='radio']:checked + label {
        background-image: url(/static/img/radio.png);
    }
    input[type='checkbox']:checked + label {
        background-image: url(/static/img/check.png);
    }
}

Fix the styling of long field names in advanced search dropdowns
Fix the styling of long field names in advanced search dropdowns

Firefox was not respecting the 0 width style, which caused the checkboxes
to have a padding on the left for the "invisible" checkboxes, *unless*
they had text long enough to wrap.

Using absolute positioning instead of float:left fixes the issues.

Connects to #2463
