├── .gitignore ├── .travis.yml ├── .github └── FUNDING.yml ├── bower.json ├── package.json ├── LICENSE.md ├── README.md ├── dist └── ress.min.css ├── .stylelintrc ├── CHANGELOG.md └── ress.css /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .sass-cache 3 | .DS_Store 4 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | node_js: 3 | - 16 4 | -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | custom: https://www.buymeacoffee.com/filipe/ 2 | -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ress", 3 | "description": "A modern CSS reset", 4 | "main": "dist/ress.min.css", 5 | "authors": [ 6 | "Filipe Linhares" 7 | ], 8 | "license": "MIT", 9 | "keywords": [ 10 | "css", 11 | "reset", 12 | "normalize" 13 | ], 14 | "homepage": "https://github.com/filipelinhares/ress", 15 | "ignore": [ 16 | "**/.*", 17 | "node_modules", 18 | "bower_components", 19 | "test", 20 | "tests" 21 | ] 22 | } 23 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ress", 3 | "description": "A modern CSS reset", 4 | "version": "5.0.2", 5 | "author": "Filipe Linhares", 6 | "bugs": { 7 | "url": "https://github.com/filipelinhares/ress/issues" 8 | }, 9 | "devDependencies": { 10 | "cssnano": "^5.1.1", 11 | "postcss-cli": "^9.1.0", 12 | "stylelint": "^14.5.3" 13 | }, 14 | "homepage": "https://github.com/filipelinhares/ress", 15 | "keywords": [ 16 | "css", 17 | "reset" 18 | ], 19 | "license": "MIT", 20 | "main": "dist/ress.min.css", 21 | "repository": { 22 | "type": "git", 23 | "url": "https://github.com/filipelinhares/ress.git" 24 | }, 25 | "scripts": { 26 | "compile": "postcss ress.css --no-map -u cssnano -o dist/ress.min.css", 27 | "test": "stylelint ress.css" 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright © 2016 [Filipe Linhares](http://filipelinhares.com) 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the “Software”), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ![A brunch and the ress name](https://i.imgur.com/NHz9ef3.png) 2 | 3 | Modern CSS reset 4 | 5 | [![Build Status](https://travis-ci.org/filipelinhares/ress.svg?branch=master)](https://travis-ci.org/filipelinhares/ress) [![Size](https://img.shields.io/bundlephobia/min/ress?color=orange)](https://github.com/filipelinhares/ress/blob/master/dist/ress.min.css) [![npm](https://img.shields.io/npm/v/ress.svg)](https://npmjs.com/ress) 6 | 7 | ## Installation 8 | 9 | ```sh 10 | npm install --save ress 11 | ``` 12 | 13 | or 14 | 15 | ```sh 16 | yarn add ress 17 | ``` 18 | 19 | ## Features 20 | 21 | 1. Apply `box-sizing: border-box;` in all elements. 22 | 2. Reset `padding` and `margin` in all elements. 23 | 3. Specify `background-repeat: no-repeat` in all elements and pseudo elements. 24 | 4. Inherit `text-decoration` and `vertical-align` to `::before` and `::after`. 25 | 5. Remove the `outline` when hovering in all browsers. 26 | 6. Specify `font-family: monospace` in code elements. 27 | 7. Reset `border-radius` in input elements. 28 | 8. Specify font inheritance of form elements. 29 | 9. Remove the default button styling in all browsers. 30 | 10. Specify textarea resizability to vertical. 31 | 11. Apply `cursor: pointer` to button elements. 32 | 12. Apply `tab-size: 4` in `html`. 33 | 13. Style `select` like a standard input. 34 | 14. Style `cursor` by aria attributes. 35 | 36 | ## Crossbrowser 37 | 38 | **ress** uses [Normalize.css](https://github.com/necolas/normalize.css) under the hood with some customizations to apply a solid base to start your stylesheet. 39 | 40 | ## Browser support 41 | 42 | - Chrome 43 | - Edge 44 | - Firefox ESR+ 45 | - Internet Explorer 10+ 46 | - Opera 47 | - Safari 8+ 48 | 49 | ## CDN 50 | 51 | [**unpkg**](https://unpkg.com) 52 | 53 | ```sh 54 | https://unpkg.com/ress/dist/ress.min.css 55 | ``` 56 | 57 | [**jsDevlivr**](https://www.jsdelivr.com/) 58 | 59 | ```sh 60 | # Production 61 | https://cdn.jsdelivr.net/npm/ress@4.0.0/dist/ress.min.css 62 | 63 | # Development 64 | https://cdn.jsdelivr.net/gh/filipelinhares/ress@latest/dist/ress.min.css 65 | ``` 66 | 67 | ## License 68 | 69 | [MIT](LICENSE.md) © Filipe Linhares 70 | -------------------------------------------------------------------------------- /dist/ress.min.css: -------------------------------------------------------------------------------- 1 | html{-webkit-text-size-adjust:100%;box-sizing:border-box;-moz-tab-size:4;tab-size:4;word-break:normal}*,:after,:before{background-repeat:no-repeat;box-sizing:inherit}:after,:before{text-decoration:inherit;vertical-align:inherit}*{margin:0;padding:0}hr{color:inherit;height:0;overflow:visible}details,main{display:block}summary{display:list-item}small{font-size:80%}[hidden]{display:none}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}a{background-color:transparent}a:active,a:hover{outline-width:0}code,kbd,pre,samp{font-family:monospace,monospace}pre{font-size:1em}b,strong{font-weight:bolder}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-color:inherit;text-indent:0}iframe{border-style:none}input{border-radius:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}textarea{overflow:auto;resize:vertical}button,input,optgroup,select,textarea{font:inherit}optgroup{font-weight:700}button{overflow:visible}button,select{text-transform:none}[role=button],[type=button],[type=reset],[type=submit],button{cursor:pointer}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button:-moz-focusring{outline:1px dotted ButtonText}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}button,input,select,textarea{background-color:transparent;border-style:none}a:focus,button:focus,input:focus,select:focus,textarea:focus{outline-width:0}select{-moz-appearance:none;-webkit-appearance:none}select::-ms-expand{display:none}select::-ms-value{color:currentColor}legend{border:0;color:inherit;display:table;max-width:100%;white-space:normal}::-webkit-file-upload-button{-webkit-appearance:button;color:inherit;font:inherit}[disabled]{cursor:default}img{border-style:none}progress{vertical-align:baseline}[aria-busy=true]{cursor:progress}[aria-controls]{cursor:pointer}[aria-disabled=true]{cursor:default} -------------------------------------------------------------------------------- /.stylelintrc: -------------------------------------------------------------------------------- 1 | { 2 | "rules": { 3 | "at-rule-empty-line-before": [ "always", { 4 | except: ["blockless-after-blockless"], 5 | ignore: ["after-comment"], 6 | } ], 7 | "block-closing-brace-newline-after": "always", 8 | "block-closing-brace-newline-before": "always-multi-line", 9 | "block-closing-brace-space-before": "always-single-line", 10 | "block-no-empty": true, 11 | "block-opening-brace-newline-after": "always-multi-line", 12 | "block-opening-brace-space-after": "always-single-line", 13 | "block-opening-brace-space-before": "always", 14 | "color-hex-case": "lower", 15 | "color-hex-length": "short", 16 | "color-no-invalid-hex": true, 17 | "declaration-bang-space-after": "never", 18 | "declaration-bang-space-before": "always", 19 | "declaration-block-semicolon-newline-after": "always-multi-line", 20 | "declaration-block-semicolon-space-after": "always-single-line", 21 | "declaration-block-semicolon-space-before": "never", 22 | "declaration-block-single-line-max-declarations": 2, 23 | "declaration-block-no-shorthand-property-overrides": true, 24 | "declaration-block-trailing-semicolon": "always", 25 | "declaration-colon-newline-after": "always-multi-line", 26 | "declaration-colon-space-after": "always-single-line", 27 | "declaration-colon-space-before": "never", 28 | "font-family-name-quotes": "always-unless-keyword", 29 | "function-calc-no-unspaced-operator": true, 30 | "function-comma-newline-after": "always-multi-line", 31 | "function-comma-space-after": "always-single-line", 32 | "function-comma-space-before": "never", 33 | "function-parentheses-newline-inside": "always-multi-line", 34 | "function-parentheses-space-inside": "never-single-line", 35 | "function-url-quotes": "always", 36 | "indentation": 2, 37 | "max-empty-lines": 1, 38 | "max-nesting-depth": 3, 39 | "media-feature-colon-space-after": "always", 40 | "media-feature-colon-space-before": "never", 41 | "media-feature-range-operator-space-after": "always", 42 | "media-feature-range-operator-space-before": "always", 43 | "media-query-list-comma-newline-after": "always-multi-line", 44 | "media-query-list-comma-space-after": "always-single-line", 45 | "media-query-list-comma-space-before": "never", 46 | "media-feature-parentheses-space-inside": "never", 47 | "no-eol-whitespace": true, 48 | "no-missing-end-of-source-newline": true, 49 | "number-leading-zero": "always", 50 | "number-no-trailing-zeros": true, 51 | "length-zero-no-unit": true, 52 | "selector-combinator-space-after": "always", 53 | "selector-combinator-space-before": "always", 54 | "selector-list-comma-newline-after": "always", 55 | "selector-list-comma-space-before": "never", 56 | "selector-pseudo-element-colon-notation": "double", 57 | "string-quotes": "single", 58 | "value-list-comma-newline-after": "always-multi-line", 59 | "value-list-comma-space-after": "always-single-line", 60 | "value-list-comma-space-before": "never", 61 | } 62 | } 63 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | ## [v5.0.0] 2 | 3 | ### Added: 4 | - `border-style` to `iframe` element ([#27](https://github.com/filipelinhares/ress/issues/27)). 5 | 6 | ### Changed: 7 | 8 | - Move `[disabled]` selector down in the cascade ([#30](https://github.com/filipelinhares/ress/issues/30)). 9 | 10 | ### Removed: 11 | 12 | - `color: inherit` from `button` ([#28](https://github.com/filipelinhares/ress/issues/28)). 13 | 14 | ## [v4.0.0] 15 | 16 | ### Added: 17 | 18 | - Reset of table element. 19 | - Color inherit for hr elements. 20 | 21 | ### Removed: 22 | 23 | - Form elements' focus outline ([#24](https://github.com/filipelinhares/ress/pull/24)) 24 | - `cursor: default` when `aria-disabled="false"` ([#26](https://github.com/filipelinhares/ress/pull/26)) 25 | - Optional style to hide content from screens but not screenreaders. More about [here](https://webaim.org/techniques/css/invisiblecontent/) 26 | 27 | ## [v3.0.1] 28 | 29 | Chaged from `cssnano-cli` to `postcss-cli`. 30 | 31 | ## [v3.0.0] 32 | 33 | ### Removed: 34 | 35 | Removed optionated `fill` style from `svg`. 36 | 37 | - `fill: currentColor` when `svg:not([fill])`. 38 | 39 | ## [v2.0.4] 40 | 41 | Fix deprecated version of `word-break`. 42 | 43 | ### Changed: 44 | 45 | - `word-break: break-word` to `word-break: normal` [#19](https://github.com/filipelinhares/ress/issues/19), thanks to [@matteobad](https://github.com/matteobad). 46 | 47 | ## [v2.0.2] 48 | 49 | ### Added: 50 | 51 | - `color: inherit` to button like elements [#18](https://github.com/filipelinhares/ress/issues/18), thanks to [@andrewpeterprifer](https://github.com/andrewpeterprifer). 52 | 53 | ## [v2.0.1] 54 | 55 | ### Removed: 56 | 57 | - Remove duplicated rule for `[type="search"]`. 58 | 59 | ## [v2.0.0] 60 | 61 | :tada: Update with the latest version of Normalize. 62 | 63 | ### Added: 64 | 65 | - Fill `svg` with the current color when `fill` is not set. 66 | - `tab-size: 4` to `html`. 67 | - **[N]** Set `text-transform: none` for `button`. 68 | - **[N]** `outline-offset: -2px` to `[type="search"]`. 69 | - **[N]** Correct `legend` style. 70 | - **[N]** `height: 0` to `hr`. 71 | - **[N]** `width: 0` to `[type="number"]::-webkit` spin button. 72 | 73 | ### Removed: 74 | 75 | - **[N]** Unnecessry normalization for general element. 76 | - **[N]** `text-decoration-skip` from `a`. 77 | - **[N]** `color: inherit` from form elements. 78 | - `overflow-y: scroll` in `html`. 79 | - **[N]** `width: auto` from `[type="number"]`. 80 | - `audio:not([controls])`. 81 | - `::selection` normalization. 82 | 83 | ### Changed: 84 | 85 | - **[N]** `border-style: none` instead of 0 for `moz-focus`. 86 | - **[N]** `abbr[title]` style from `border-bottom` to `text-decoration`. 87 | 88 | **[N]**_ormalize updates._ 89 | 90 | ## [v1.2.2] 91 | 92 | - Also set `background-repeat: no-repeat` to pseudo elements (#14). 93 | 94 | ## [v1.1.2] 95 | 96 | - Add missing comma on button elements selector. 97 | 98 | ## [v1.1.1] 99 | 100 | :tada: New feature and updates from Normalize. 101 | 102 | ### Added: 103 | 104 | - **[N]** Correct the display of `` in all browsers. 105 | - Apply cursor pointer to button elements - (#7). 106 | 107 | ### Removed: 108 | 109 | - **[N]** Placeholder normalization. 110 | 111 | ### Changed: 112 | 113 | - Text selection color to improves a11y - Thanks @dcorb. 114 | 115 | **[N]**_ormalize updates._ 116 | 117 | ## [v1.0.1] 118 | 119 | Just README updates and code comments. 120 | 121 | ## [v1.0.0] 122 | 123 | #### :zap: sanilize.css renamed to ress 124 | 125 | Before [Sanitize version 3.0.0](https://github.com/10up/sanitize.css/commit/8eb14223c1d5c928a2a51b17d4227849e7b5bdb7) be released, I was thinking about removing the description _"Merge between"_ from sanilize. Sanilize came with some deprecations that I wanted to keep and some new features that I wanted to remove. 126 | 127 | Now with the release of [Sanitize version 4.0.0](https://github.com/10up/sanitize.css/commit/bf3d695016cbd5d17c89361d4273f3d5f69aa0ee) It's time to a new way. 128 | 129 | Since the fork of sanitize, my goal with this project is to make a modern reset with crossbrowsers normalization. Now, **ress** has your own features and resets which you can use and customize. 130 | 131 | The new cool features are documented in the [README](README.md/#features). The source code is clean and pretty documented, you can read it to learn something. :smile: 132 | 133 | ## [v0.7.4] 134 | 135 | - Release a landing page :smile: - [sanilize.css](http://filipelinhares.github.io/sanilize.css/). 136 | 137 | ### Removed: 138 | 139 | - Remove unnecessary comments to keep the code clean. 140 | - Remove `list-style: none;` from `nav ul, nav ol`. 141 | - Remove `-ms-overflow-style: -ms-autohiding-scrollbar` from `html`. 142 | 143 | ## [v0.7.3] 144 | 145 | Updates from normalize 4.1.1. 146 | 147 | ### Added: 148 | 149 | - Normalize placeholder styles in Edge, Chrome, and Safari with Firefox. 150 | - Normalize file select buttons. 151 | - Remove gaps in links underline in iOS 8+ and Safari 8+. 152 | 153 | ### Removed: 154 | 155 | - Remove unnecessary specificity in inputs. 156 | 157 | ### Changed: 158 | 159 | - Correct the outline of search inputs in Chrome and Safari. 160 | - Limit Firefox focus normalization to buttons. 161 | 162 | ## [v0.6.3] 163 | 164 | Updates from normalize.css 4.0.0. 165 | 166 | ### Added: 167 | 168 | - Correct inconsistent `overflow` for `hr` in Edge and IE. 169 | - Correct `legend` text wrapping not present in Edge and IE. 170 | 171 | ### Removed: 172 | 173 | - Opinionated `table` resets. 174 | - Opinionated `pre` overflow. 175 | 176 | ### Changed: 177 | 178 | - Opinionated style of `outline-width` for `a:active` and `a:hover`. 179 | - Update normalization of `border-style` for `img`. 180 | - Update normalization of color inheritance for `legend`. 181 | -------------------------------------------------------------------------------- /ress.css: -------------------------------------------------------------------------------- 1 | /* resset.dev • v5.0.2 */ 2 | 3 | /* # ================================================================= 4 | # Global selectors 5 | # ================================================================= */ 6 | 7 | html { 8 | box-sizing: border-box; 9 | -webkit-text-size-adjust: 100%; /* Prevent adjustments of font size after orientation changes in iOS */ 10 | word-break: normal; 11 | -moz-tab-size: 4; 12 | tab-size: 4; 13 | } 14 | 15 | *, 16 | ::before, 17 | ::after { 18 | background-repeat: no-repeat; /* Set `background-repeat: no-repeat` to all elements and pseudo elements */ 19 | box-sizing: inherit; 20 | } 21 | 22 | ::before, 23 | ::after { 24 | text-decoration: inherit; /* Inherit text-decoration and vertical align to ::before and ::after pseudo elements */ 25 | vertical-align: inherit; 26 | } 27 | 28 | * { 29 | padding: 0; /* Reset `padding` and `margin` of all elements */ 30 | margin: 0; 31 | } 32 | 33 | /* # ================================================================= 34 | # General elements 35 | # ================================================================= */ 36 | 37 | hr { 38 | overflow: visible; /* Show the overflow in Edge and IE */ 39 | height: 0; /* Add the correct box sizing in Firefox */ 40 | color: inherit; /* Correct border color in Firefox. */ 41 | } 42 | 43 | details, 44 | main { 45 | display: block; /* Render the `main` element consistently in IE. */ 46 | } 47 | 48 | summary { 49 | display: list-item; /* Add the correct display in all browsers */ 50 | } 51 | 52 | small { 53 | font-size: 80%; /* Set font-size to 80% in `small` elements */ 54 | } 55 | 56 | [hidden] { 57 | display: none; /* Add the correct display in IE */ 58 | } 59 | 60 | abbr[title] { 61 | border-bottom: none; /* Remove the bottom border in Chrome 57 */ 62 | /* Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari */ 63 | text-decoration: underline; 64 | text-decoration: underline dotted; 65 | } 66 | 67 | a { 68 | background-color: transparent; /* Remove the gray background on active links in IE 10 */ 69 | } 70 | 71 | a:active, 72 | a:hover { 73 | outline-width: 0; /* Remove the outline when hovering in all browsers */ 74 | } 75 | 76 | code, 77 | kbd, 78 | pre, 79 | samp { 80 | font-family: monospace, monospace; /* Specify the font family of code elements */ 81 | } 82 | 83 | pre { 84 | font-size: 1em; /* Correct the odd `em` font sizing in all browsers */ 85 | } 86 | 87 | b, 88 | strong { 89 | font-weight: bolder; /* Add the correct font weight in Chrome, Edge, and Safari */ 90 | } 91 | 92 | /* https://gist.github.com/unruthless/413930 */ 93 | sub, 94 | sup { 95 | font-size: 75%; 96 | line-height: 0; 97 | position: relative; 98 | vertical-align: baseline; 99 | } 100 | 101 | sub { 102 | bottom: -0.25em; 103 | } 104 | 105 | sup { 106 | top: -0.5em; 107 | } 108 | 109 | table { 110 | border-color: inherit; /* Correct border color in all Chrome, Edge, and Safari. */ 111 | text-indent: 0; /* Remove text indentation in Chrome, Edge, and Safari */ 112 | } 113 | 114 | iframe { 115 | border-style: none; 116 | } 117 | 118 | /* # ================================================================= 119 | # Forms 120 | # ================================================================= */ 121 | 122 | input { 123 | border-radius: 0; 124 | } 125 | 126 | [type='number']::-webkit-inner-spin-button, 127 | [type='number']::-webkit-outer-spin-button { 128 | height: auto; /* Correct the cursor style of increment and decrement buttons in Chrome */ 129 | } 130 | 131 | [type='search'] { 132 | -webkit-appearance: textfield; /* Correct the odd appearance in Chrome and Safari */ 133 | outline-offset: -2px; /* Correct the outline style in Safari */ 134 | } 135 | 136 | [type='search']::-webkit-search-decoration { 137 | -webkit-appearance: none; /* Remove the inner padding in Chrome and Safari on macOS */ 138 | } 139 | 140 | textarea { 141 | overflow: auto; /* Internet Explorer 11+ */ 142 | resize: vertical; /* Specify textarea resizability */ 143 | } 144 | 145 | button, 146 | input, 147 | optgroup, 148 | select, 149 | textarea { 150 | font: inherit; /* Specify font inheritance of form elements */ 151 | } 152 | 153 | optgroup { 154 | font-weight: bold; /* Restore the font weight unset by the previous rule */ 155 | } 156 | 157 | button { 158 | overflow: visible; /* Address `overflow` set to `hidden` in IE 8/9/10/11 */ 159 | } 160 | 161 | button, 162 | select { 163 | text-transform: none; /* Firefox 40+, Internet Explorer 11- */ 164 | } 165 | 166 | /* Apply cursor pointer to button elements */ 167 | button, 168 | [type='button'], 169 | [type='reset'], 170 | [type='submit'], 171 | [role='button'] { 172 | cursor: pointer; 173 | } 174 | 175 | /* Remove inner padding and border in Firefox 4+ */ 176 | button::-moz-focus-inner, 177 | [type='button']::-moz-focus-inner, 178 | [type='reset']::-moz-focus-inner, 179 | [type='submit']::-moz-focus-inner { 180 | border-style: none; 181 | padding: 0; 182 | } 183 | 184 | /* Replace focus style removed in the border reset above */ 185 | button:-moz-focusring, 186 | [type='button']::-moz-focus-inner, 187 | [type='reset']::-moz-focus-inner, 188 | [type='submit']::-moz-focus-inner { 189 | outline: 1px dotted ButtonText; 190 | } 191 | 192 | button, 193 | html [type='button'], /* Prevent a WebKit bug where (2) destroys native `audio` and `video`controls in Android 4 */ 194 | [type='reset'], 195 | [type='submit'] { 196 | -webkit-appearance: button; /* Correct the inability to style clickable types in iOS */ 197 | } 198 | 199 | /* Remove the default button styling in all browsers */ 200 | button, 201 | input, 202 | select, 203 | textarea { 204 | background-color: transparent; 205 | border-style: none; 206 | } 207 | 208 | a:focus, 209 | button:focus, 210 | input:focus, 211 | select:focus, 212 | textarea:focus { 213 | outline-width: 0; 214 | } 215 | 216 | /* Style select like a standard input */ 217 | select { 218 | -moz-appearance: none; /* Firefox 36+ */ 219 | -webkit-appearance: none; /* Chrome 41+ */ 220 | } 221 | 222 | select::-ms-expand { 223 | display: none; /* Internet Explorer 11+ */ 224 | } 225 | 226 | select::-ms-value { 227 | color: currentColor; /* Internet Explorer 11+ */ 228 | } 229 | 230 | legend { 231 | border: 0; /* Correct `color` not being inherited in IE 8/9/10/11 */ 232 | color: inherit; /* Correct the color inheritance from `fieldset` elements in IE */ 233 | display: table; /* Correct the text wrapping in Edge and IE */ 234 | max-width: 100%; /* Correct the text wrapping in Edge and IE */ 235 | white-space: normal; /* Correct the text wrapping in Edge and IE */ 236 | max-width: 100%; /* Correct the text wrapping in Edge 18- and IE */ 237 | } 238 | 239 | ::-webkit-file-upload-button { 240 | /* Correct the inability to style clickable types in iOS and Safari */ 241 | -webkit-appearance: button; 242 | color: inherit; 243 | font: inherit; /* Change font properties to `inherit` in Chrome and Safari */ 244 | } 245 | 246 | /* Replace pointer cursor in disabled elements */ 247 | [disabled] { 248 | cursor: default; 249 | } 250 | 251 | /* # ================================================================= 252 | # Specify media element style 253 | # ================================================================= */ 254 | 255 | img { 256 | border-style: none; /* Remove border when inside `a` element in IE 8/9/10 */ 257 | } 258 | 259 | /* Add the correct vertical alignment in Chrome, Firefox, and Opera */ 260 | progress { 261 | vertical-align: baseline; 262 | } 263 | 264 | /* # ================================================================= 265 | # Accessibility 266 | # ================================================================= */ 267 | 268 | /* Specify the progress cursor of updating elements */ 269 | [aria-busy='true'] { 270 | cursor: progress; 271 | } 272 | 273 | /* Specify the pointer cursor of trigger elements */ 274 | [aria-controls] { 275 | cursor: pointer; 276 | } 277 | 278 | /* Specify the unstyled cursor of disabled, not-editable, or otherwise inoperable elements */ 279 | [aria-disabled='true'] { 280 | cursor: default; 281 | } 282 | --------------------------------------------------------------------------------