normalize.styl
1 /*! normalize.css v3.0.2 | MIT License | git.io/normalize */ 2 3 /** 4 * 1. Set default font family to sans-serif. 5 * 2. Prevent iOS text size adjust after orientation change, without disabling 6 * user zoom. 7 */ 8 9 html { 10 -ms-text-size-adjust: 100%; /* 2 */ 11 -webkit-text-size-adjust: 100%; /* 2 */ 12 } 13 14 /** 15 * Remove default margin. 16 */ 17 18 body { 19 margin: 0; 20 } 21 22 /* HTML5 display definitions 23 ========================================================================== */ 24 25 /** 26 * Correct `block` display not defined for any HTML5 element in IE 8/9. 27 * Correct `block` display not defined for `details` or `summary` in IE 10/11 28 * and Firefox. 29 * Correct `block` display not defined for `main` in IE 11. 30 */ 31 32 article, 33 aside, 34 details, 35 figcaption, 36 figure, 37 footer, 38 header, 39 hgroup, 40 main, 41 menu, 42 nav, 43 section, 44 summary { 45 display: block; 46 } 47 48 /** 49 * 1. Correct `inline-block` display not defined in IE 8/9. 50 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. 51 */ 52 53 audio, 54 canvas, 55 progress, 56 video { 57 display: inline-block; /* 1 */ 58 vertical-align: baseline; /* 2 */ 59 } 60 61 /** 62 * Prevent modern browsers from displaying `audio` without controls. 63 * Remove excess height in iOS 5 devices. 64 */ 65 66 audio:not([controls]) { 67 display: none; 68 height: 0; 69 } 70 71 /** 72 * Address `[hidden]` styling not present in IE 8/9/10. 73 * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. 74 */ 75 76 [hidden], 77 template { 78 display: none; 79 } 80 81 /* Links 82 ========================================================================== */ 83 84 /** 85 * Remove the gray background color from active links in IE 10. 86 */ 87 88 a { 89 background-color: transparent; 90 } 91 92 /** 93 * Improve readability when focused and also mouse hovered in all browsers. 94 */ 95 96 a:active, 97 a:hover { 98 outline: 0; 99 } 100 101 /* Text-level semantics 102 ========================================================================== */ 103 104 /** 105 * Address styling not present in IE 8/9/10/11, Safari, and Chrome. 106 */ 107 108 abbr[title] { 109 border-bottom: 1px dotted; 110 } 111 112 /** 113 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. 114 */ 115 116 b, 117 strong { 118 font-weight: bold; 119 } 120 121 /** 122 * Address styling not present in Safari and Chrome. 123 */ 124 125 dfn { 126 font-style: italic; 127 } 128 129 /** 130 * Address variable `h1` font-size and margin within `section` and `article` 131 * contexts in Firefox 4+, Safari, and Chrome. 132 */ 133 134 h1 { 135 font-size: 2em; 136 margin: 0; 137 } 138 139 /** 140 * Address styling not present in IE 8/9. 141 */ 142 143 mark { 144 background: #ff0; 145 color: #000; 146 } 147 148 /** 149 * Address inconsistent and variable font size in all browsers. 150 */ 151 152 small { 153 font-size: 80%; 154 } 155 156 /** 157 * Prevent `sub` and `sup` affecting `line-height` in all browsers. 158 */ 159 160 sub, 161 sup { 162 font-size: 75%; 163 line-height: 0; 164 position: relative; 165 vertical-align: baseline; 166 } 167 168 sup { 169 top: -0.5em; 170 } 171 172 sub { 173 bottom: -0.25em; 174 } 175 176 /* Embedded content 177 ========================================================================== */ 178 179 /** 180 * Remove border when inside `a` element in IE 8/9/10. 181 */ 182 183 img { 184 border: 0; 185 } 186 187 /** 188 * Correct overflow not hidden in IE 9/10/11. 189 */ 190 191 svg:not(:root) { 192 overflow: hidden; 193 } 194 195 /* Grouping content 196 ========================================================================== */ 197 198 /** 199 * Address margin not present in IE 8/9 and Safari. 200 */ 201 202 figure { 203 margin: 1em 40px; 204 } 205 206 /** 207 * Address differences between Firefox and other browsers. 208 */ 209 210 hr { 211 -moz-box-sizing: content-box; 212 box-sizing: content-box; 213 height: 0; 214 } 215 216 /** 217 * Contain overflow in all browsers. 218 */ 219 220 pre { 221 overflow: auto; 222 } 223 224 /** 225 * Address odd `em`-unit font size rendering in all browsers. 226 */ 227 228 code, 229 kbd, 230 pre, 231 samp { 232 font-family: monospace, monospace; 233 font-size: 1em; 234 } 235 236 /* Forms 237 ========================================================================== */ 238 239 /** 240 * Known limitation: by default, Chrome and Safari on OS X allow very limited 241 * styling of `select`, unless a `border` property is set. 242 */ 243 244 /** 245 * 1. Correct color not being inherited. 246 * Known issue: affects color of disabled elements. 247 * 2. Correct font properties not being inherited. 248 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. 249 */ 250 251 button, 252 input, 253 optgroup, 254 select, 255 textarea { 256 color: inherit; /* 1 */ 257 font: inherit; /* 2 */ 258 margin: 0; /* 3 */ 259 } 260 261 /** 262 * Address `overflow` set to `hidden` in IE 8/9/10/11. 263 */ 264 265 button { 266 overflow: visible; 267 } 268 269 /** 270 * Address inconsistent `text-transform` inheritance for `button` and `select`. 271 * All other form control elements do not inherit `text-transform` values. 272 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. 273 * Correct `select` style inheritance in Firefox. 274 */ 275 276 button, 277 select { 278 text-transform: none; 279 } 280 281 /** 282 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` 283 * and `video` controls. 284 * 2. Correct inability to style clickable `input` types in iOS. 285 * 3. Improve usability and consistency of cursor style between image-type 286 * `input` and others. 287 */ 288 289 button, 290 html input[type="button"], /* 1 */ 291 input[type="reset"], 292 input[type="submit"] { 293 -webkit-appearance: button; /* 2 */ 294 cursor: pointer; /* 3 */ 295 } 296 297 /** 298 * Re-set default cursor for disabled elements. 299 */ 300 301 button[disabled], 302 html input[disabled] { 303 cursor: default; 304 } 305 306 /** 307 * Remove inner padding and border in Firefox 4+. 308 */ 309 310 button::-moz-focus-inner, 311 input::-moz-focus-inner { 312 border: 0; 313 padding: 0; 314 } 315 316 /** 317 * Address Firefox 4+ setting `line-height` on `input` using `!important` in 318 * the UA stylesheet. 319 */ 320 321 input { 322 line-height: normal; 323 } 324 325 /** 326 * It's recommended that you don't attempt to style these elements. 327 * Firefox's implementation doesn't respect box-sizing, padding, or width. 328 * 329 * 1. Address box sizing set to `content-box` in IE 8/9/10. 330 * 2. Remove excess padding in IE 8/9/10. 331 */ 332 333 input[type="checkbox"], 334 input[type="radio"] { 335 box-sizing: border-box; /* 1 */ 336 padding: 0; /* 2 */ 337 } 338 339 /** 340 * Fix the cursor style for Chrome's increment/decrement buttons. For certain 341 * `font-size` values of the `input`, it causes the cursor style of the 342 * decrement button to change from `default` to `text`. 343 */ 344 345 input[type="number"]::-webkit-inner-spin-button, 346 input[type="number"]::-webkit-outer-spin-button { 347 height: auto; 348 } 349 350 /** 351 * 1. Address `appearance` set to `searchfield` in Safari and Chrome. 352 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome 353 * (include `-moz` to future-proof). 354 */ 355 356 input[type="search"] { 357 -webkit-appearance: textfield; /* 1 */ 358 -moz-box-sizing: content-box; 359 -webkit-box-sizing: content-box; /* 2 */ 360 box-sizing: content-box; 361 } 362 363 /** 364 * Remove inner padding and search cancel button in Safari and Chrome on OS X. 365 * Safari (but not Chrome) clips the cancel button when the search input has 366 * padding (and `textfield` appearance). 367 */ 368 369 input[type="search"]::-webkit-search-cancel-button, 370 input[type="search"]::-webkit-search-decoration { 371 -webkit-appearance: none; 372 } 373 374 /** 375 * Define consistent border, margin, and padding. 376 */ 377 378 fieldset { 379 border: 1px solid #c0c0c0; 380 margin: 0 2px; 381 padding: 0.35em 0.625em 0.75em; 382 } 383 384 /** 385 * 1. Correct `color` not being inherited in IE 8/9/10/11. 386 * 2. Remove padding so people aren't caught out if they zero out fieldsets. 387 */ 388 389 legend { 390 border: 0; /* 1 */ 391 padding: 0; /* 2 */ 392 } 393 394 /** 395 * Remove default vertical scrollbar in IE 8/9/10/11. 396 */ 397 398 textarea { 399 overflow: auto; 400 } 401 402 /** 403 * Don't inherit the `font-weight` (applied by a rule above). 404 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. 405 */ 406 407 optgroup { 408 font-weight: bold; 409 } 410 411 /* Tables 412 ========================================================================== */ 413 414 /** 415 * Remove most spacing between table cells. 416 */ 417 418 table { 419 border-collapse: collapse; 420 border-spacing: 0; 421 } 422 423 td, 424 th { 425 padding: 0; 426 }