diff --git a/scss/.scsslint.yml b/scss/.scsslint.yml index 7c5573f744..35ce8194f8 100644 --- a/scss/.scsslint.yml +++ b/scss/.scsslint.yml @@ -102,6 +102,9 @@ linters: "bottom", "left", "z-index", + "-webkit-box-sizing", + "-moz-box-sizing", + "box-sizing", "display", "float", "width", @@ -110,10 +113,6 @@ linters: "height", "min-height", "max-height", - "-webkit-box-sizing", - "-moz-box-sizing", - "box-sizing", - "-webkit-appearance", "flex", "flex-direction", "flex-flow", diff --git a/scss/_custom-forms.scss b/scss/_custom-forms.scss index 50731111fb..c63c9c1856 100644 --- a/scss/_custom-forms.scss +++ b/scss/_custom-forms.scss @@ -126,23 +126,22 @@ // // Replaces the browser default select with a custom one, mostly pulled from // http://primercss.io. +// +// Includes IE9-specific hacks (noted by ` \9`). .c-select { display: inline-block; max-width: 100%; padding: .375rem 1.75rem .375rem .75rem; + padding-right: .75rem \9; vertical-align: middle; background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAUCAMAAACzvE1FAAAADFBMVEUzMzMzMzMzMzMzMzMKAG/3AAAAA3RSTlMAf4C/aSLHAAAAPElEQVR42q3NMQ4AIAgEQTn//2cLdRKppSGzBYwzVXvznNWs8C58CiussPJj8h6NwgorrKRdTvuV9v16Afn0AYFOB7aYAAAAAElFTkSuQmCC) no-repeat right .75rem center; + background-image: none \9; background-size: 8px 10px; border: 1px solid $input-border; - - // Have to include vendor prefixes as the `appearance` property isn't part of the CSS spec. - -webkit-appearance: none; + // Use vendor prefixes as `appearance` isn't part of the CSS spec. -moz-appearance: none; - - // IE9 hacks to hide the background-image and reduce padding - padding-right: .75rem \9; - background-image: none \9; + -webkit-appearance: none; &:focus { border-color: #51a7e8; diff --git a/scss/_dropdown.scss b/scss/_dropdown.scss index d3588d2707..b1a7f5c440 100644 --- a/scss/_dropdown.scss +++ b/scss/_dropdown.scss @@ -51,20 +51,20 @@ } // Links, buttons, and more within the dropdown menu +// +// `