UNPKG

7.99 kBCSSView Raw
1/*! de-style.css v1.0.5 | MIT License | https://github.com/nicolas-cusan/destyle.css */
2
3/* Reset box-model
4 ========================================================================== */
5
6* {
7 box-sizing: border-box;
8}
9
10::before,
11::after {
12 box-sizing: inherit;
13}
14
15/* Document
16 ========================================================================== */
17
18/**
19 * 1. Correct the line height in all browsers.
20 * 2. Prevent adjustments of font size after orientation changes in iOS.
21 * 3. Remove gray overlay on links for iOS.
22 */
23
24html {
25 line-height: 1.15; /* 1 */
26 -webkit-text-size-adjust: 100%; /* 2 */
27 -webkit-tap-highlight-color: transparent; /* 3*/
28}
29
30/* Sections
31 ========================================================================== */
32
33/**
34 * Remove the margin in all browsers.
35 */
36
37body {
38 margin: 0;
39}
40
41/**
42 * Render the `main` element consistently in IE.
43 */
44
45main {
46 display: block;
47}
48
49/* Vertical rhythm
50 ========================================================================== */
51
52p,
53table,
54blockquote,
55address,
56pre,
57iframe,
58form,
59figure,
60dl {
61 margin: 0;
62}
63
64/* Headings
65 ========================================================================== */
66
67h1,
68h2,
69h3,
70h4,
71h5,
72h6 {
73 font-size: inherit;
74 line-height: inherit;
75 font-weight: inherit;
76 margin: 0;
77}
78
79/* Lists (enumeration)
80 ========================================================================== */
81
82ul,
83ol {
84 margin: 0;
85 padding: 0;
86 list-style: none;
87}
88
89/* Lists (definition)
90 ========================================================================== */
91
92dt {
93 font-weight: bold;
94}
95
96dd {
97 margin-left: 0;
98}
99
100/* Grouping content
101 ========================================================================== */
102
103/**
104 * 1. Add the correct box sizing in Firefox.
105 * 2. Show the overflow in Edge and IE.
106 */
107
108hr {
109 box-sizing: content-box; /* 1 */
110 height: 0; /* 1 */
111 overflow: visible; /* 2 */
112 border: 0;
113 border-top: 1px solid;
114 margin: 0;
115 clear: both;
116}
117
118/**
119 * 1. Correct the inheritance and scaling of font size in all browsers.
120 * 2. Correct the odd `em` font sizing in all browsers.
121 */
122
123pre {
124 font-family: monospace, monospace; /* 1 */
125 font-size: inherit; /* 2 */
126}
127
128address {
129 font-style: inherit;
130}
131
132/* Text-level semantics
133 ========================================================================== */
134
135/**
136 * Remove the gray background on active links in IE 10.
137 */
138
139a {
140 background-color: transparent;
141 text-decoration: none;
142 color: inherit;
143}
144
145/**
146 * 1. Remove the bottom border in Chrome 57-
147 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
148 */
149
150abbr[title] {
151 border-bottom: none; /* 1 */
152 text-decoration: underline; /* 2 */
153 text-decoration: underline dotted; /* 2 */
154}
155
156/**
157 * Add the correct font weight in Chrome, Edge, and Safari.
158 */
159
160b,
161strong {
162 font-weight: bolder;
163}
164
165/**
166 * 1. Correct the inheritance and scaling of font size in all browsers.
167 * 2. Correct the odd `em` font sizing in all browsers.
168 */
169
170code,
171kbd,
172samp {
173 font-family: monospace, monospace; /* 1 */
174 font-size: inherit; /* 2 */
175}
176
177/**
178 * Add the correct font size in all browsers.
179 */
180
181small {
182 font-size: 80%;
183}
184
185/**
186 * Prevent `sub` and `sup` elements from affecting the line height in
187 * all browsers.
188 */
189
190sub,
191sup {
192 font-size: 75%;
193 line-height: 0;
194 position: relative;
195 vertical-align: baseline;
196}
197
198sub {
199 bottom: -0.25em;
200}
201
202sup {
203 top: -0.5em;
204}
205
206/* Embedded content
207 ========================================================================== */
208
209/**
210 * Remove the border on images inside links in IE 10.
211 */
212
213img {
214 border-style: none;
215 vertical-align: bottom;
216}
217
218embed,
219object,
220iframe {
221 border: 0;
222 vertical-align: bottom;
223}
224
225/* Forms
226 ========================================================================== */
227
228button,
229input,
230optgroup,
231select,
232textarea {
233 vertical-align: middle;
234 color: inherit;
235 font: inherit;
236 border: 0;
237 background: transparent;
238 padding: 0;
239 margin: 0;
240 outline: 0;
241}
242
243/**
244 * Remove all Style fro select elements. Does not quite work cross-browser
245 */
246
247select {
248 -webkit-appearance: none;
249 appearance: none;
250 border-radius: 0;
251}
252
253/**
254 * Show the overflow in IE.
255 * 1. Show the overflow in Edge.
256 */
257
258button,
259input {
260 /* 1 */
261 overflow: visible;
262}
263
264/**
265 * Remove the inheritance of text transform in Edge, Firefox, and IE.
266 * 1. Remove the inheritance of text transform in Firefox.
267 */
268
269button,
270select {
271 /* 1 */
272 text-transform: none;
273}
274
275/**
276 * Correct the inability to style clickable types in iOS and Safari.
277 */
278
279button,
280[type='button'],
281[type='reset'],
282[type='submit'] {
283 cursor: pointer;
284 -webkit-appearance: none;
285 appearance: none;
286}
287
288button[disabled],
289[type='button'][disabled],
290[type='reset'][disabled],
291[type='submit'][disabled] {
292 cursor: default;
293}
294
295/**
296 * Remove the inner border and padding in Firefox.
297 */
298
299button::-moz-focus-inner,
300[type='button']::-moz-focus-inner,
301[type='reset']::-moz-focus-inner,
302[type='submit']::-moz-focus-inner {
303 border-style: none;
304 padding: 0;
305}
306
307/**
308 * Restore the focus styles unset by the previous rule.
309 */
310
311button:-moz-focusring,
312[type='button']:-moz-focusring,
313[type='reset']:-moz-focusring,
314[type='submit']:-moz-focusring {
315 outline: 1px dotted ButtonText;
316}
317
318/**
319 * Reset to invisible
320 */
321
322fieldset {
323 margin: 0;
324 padding: 0;
325 border: 0;
326 min-width: 0;
327}
328
329/**
330 * 1. Correct the text wrapping in Edge and IE.
331 * 2. Correct the color inheritance from `fieldset` elements in IE.
332 * 3. Remove the padding so developers are not caught out when they zero out
333 * `fieldset` elements in all browsers.
334 */
335
336legend {
337 color: inherit; /* 2 */
338 display: table; /* 1 */
339 max-width: 100%; /* 1 */
340 padding: 0; /* 3 */
341 white-space: normal; /* 1 */
342}
343
344/**
345 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
346 */
347
348progress {
349 vertical-align: baseline;
350}
351
352/**
353 * Remove the default vertical scrollbar in IE 10+.
354 */
355
356textarea {
357 overflow: auto;
358}
359
360/**
361 * 1. Add the correct box sizing in IE 10.
362 * 2. Remove the padding in IE 10.
363 */
364
365[type='checkbox'],
366[type='radio'] {
367 box-sizing: border-box; /* 1 */
368 padding: 0; /* 2 */
369}
370
371/**
372 * Correct the cursor style of increment and decrement buttons in Chrome.
373 */
374
375[type='number']::-webkit-inner-spin-button,
376[type='number']::-webkit-outer-spin-button {
377 height: auto;
378}
379
380/**
381 * 1. Correct the odd appearance in Chrome and Safari.
382 * 2. Correct the outline style in Safari.
383 */
384
385[type='search'] {
386 -webkit-appearance: textfield; /* 1 */
387 outline-offset: -2px; /* 2 */
388}
389
390/**
391 * Remove the inner padding in Chrome and Safari on macOS.
392 */
393
394[type='search']::-webkit-search-decoration {
395 -webkit-appearance: none;
396}
397
398/**
399 * 1. Correct the inability to style clickable types in iOS and Safari.
400 * 2. Change font properties to `inherit` in Safari.
401 */
402
403::-webkit-file-upload-button {
404 -webkit-appearance: button; /* 1 */
405 font: inherit; /* 2 */
406}
407
408/**
409 * Fix placeholder font properties inheritance.
410 */
411
412::-webkit-input-placeholder {
413 font: inherit;
414}
415
416:-ms-input-placeholder {
417 font: inherit;
418}
419
420::-ms-input-placeholder {
421 font: inherit;
422}
423
424::placeholder {
425 font: inherit;
426}
427
428/**
429 * Clickable labels
430 */
431
432label[for] {
433 cursor: pointer;
434}
435
436/* Interactive
437 ========================================================================== */
438
439/*
440 * Add the correct display in Edge, IE 10+, and Firefox.
441 */
442
443details {
444 display: block;
445}
446
447/*
448 * Add the correct display in all browsers.
449 */
450
451summary {
452 display: list-item;
453}
454
455/* Table
456 ========================================================================== */
457
458table {
459 border-collapse: collapse;
460 border-spacing: 0;
461}
462
463caption {
464 text-align: left;
465}
466
467td,
468th {
469 vertical-align: top;
470}
471
472th {
473 text-align: left;
474 font-weight: bold;
475}
476
477/* Misc
478 ========================================================================== */
479
480/**
481 * Add the correct display in IE 10+.
482 */
483
484template {
485 display: none;
486}
487
488/**
489 * Add the correct display in IE 10.
490 */
491
492[hidden] {
493 display: none;
494}