normalize.css 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264
  1. /* Document
  2. * ========================================================================== */
  3. /**
  4. * 1. Correct the line height in all browsers.
  5. */
  6. :where(html) {
  7. line-height: 1.15; /* 1 */
  8. }
  9. /* Sections
  10. * ========================================================================== */
  11. /**
  12. * Correct the font size and margin on `h1` elements within `section` and
  13. * `article` contexts in Chrome, Edge, Firefox, and Safari.
  14. */
  15. :where(h1) {
  16. font-size: 2em;
  17. margin-block-end: 0.67em;
  18. margin-block-start: 0.67em;
  19. }
  20. /* Grouping content
  21. * ========================================================================== */
  22. /**
  23. * Remove the margin on nested lists in Chrome, Edge, and Safari.
  24. */
  25. :where(dl, ol, ul) :where(dl, ol, ul) {
  26. margin-block-end: 0;
  27. margin-block-start: 0;
  28. }
  29. /**
  30. * 1. Add the correct box sizing in Firefox.
  31. * 2. Correct the inheritance of border color in Firefox.
  32. */
  33. :where(hr) {
  34. box-sizing: content-box; /* 1 */
  35. color: inherit; /* 2 */
  36. height: 0; /* 1 */
  37. }
  38. /**
  39. * 1. Correct the inheritance and scaling of font size in all browsers.
  40. * 2. Correct the odd `em` font sizing in all browsers.
  41. */
  42. :where(pre) {
  43. font-family: monospace, monospace; /* 1 */
  44. font-size: 1em; /* 2 */
  45. }
  46. /* Text-level semantics
  47. * ========================================================================== */
  48. /**
  49. * Add the correct text decoration in Safari.
  50. */
  51. :where(abbr[title]) {
  52. text-decoration: underline;
  53. text-decoration: underline dotted;
  54. }
  55. /**
  56. * Add the correct font weight in Chrome, Edge, and Safari.
  57. */
  58. :where(b, strong) {
  59. font-weight: bolder;
  60. }
  61. /**
  62. * 1. Correct the inheritance and scaling of font size in all browsers.
  63. * 2. Correct the odd `em` font sizing in all browsers.
  64. */
  65. :where(code, kbd, samp) {
  66. font-family: monospace, monospace; /* 1 */
  67. font-size: 1em; /* 2 */
  68. }
  69. /**
  70. * Add the correct font size in all browsers.
  71. */
  72. :where(small) {
  73. font-size: 80%;
  74. }
  75. /* Tabular data
  76. * ========================================================================== */
  77. /**
  78. * 1. Correct table border color in Chrome, Edge, and Safari.
  79. * 2. Remove text indentation from table contents in Chrome, Edge, and Safari.
  80. */
  81. :where(table) {
  82. border-color: currentColor; /* 1 */
  83. text-indent: 0; /* 2 */
  84. }
  85. /* Forms
  86. * ========================================================================== */
  87. /**
  88. * Remove the margin on controls in Safari.
  89. */
  90. :where(button, input, select) {
  91. margin: 0;
  92. }
  93. /**
  94. * Remove the inheritance of text transform in Firefox.
  95. */
  96. :where(button) {
  97. text-transform: none;
  98. }
  99. /**
  100. * Correct the inability to style buttons in iOS and Safari.
  101. */
  102. :where(button, input:is([type="button" i], [type="reset" i], [type="submit" i])) {
  103. -webkit-appearance: button;
  104. }
  105. /**
  106. * Add the correct vertical alignment in Chrome, Edge, and Firefox.
  107. */
  108. :where(progress) {
  109. vertical-align: baseline;
  110. }
  111. /**
  112. * Remove the inheritance of text transform in Firefox.
  113. */
  114. :where(select) {
  115. text-transform: none;
  116. }
  117. /**
  118. * Remove the margin in Firefox and Safari.
  119. */
  120. :where(textarea) {
  121. margin: 0;
  122. }
  123. /**
  124. * 1. Correct the odd appearance in Chrome, Edge, and Safari.
  125. * 2. Correct the outline style in Safari.
  126. */
  127. :where(input[type="search" i]) {
  128. -webkit-appearance: textfield; /* 1 */
  129. outline-offset: -2px; /* 2 */
  130. }
  131. /**
  132. * Correct the cursor style of increment and decrement buttons in Safari.
  133. */
  134. ::-webkit-inner-spin-button,
  135. ::-webkit-outer-spin-button {
  136. height: auto;
  137. }
  138. /**
  139. * Correct the text style of placeholders in Chrome, Edge, and Safari.
  140. */
  141. ::-webkit-input-placeholder {
  142. color: inherit;
  143. opacity: 0.54;
  144. }
  145. /**
  146. * Remove the inner padding in Chrome, Edge, and Safari on macOS.
  147. */
  148. ::-webkit-search-decoration {
  149. -webkit-appearance: none;
  150. }
  151. /**
  152. * 1. Correct the inability to style upload buttons in iOS and Safari.
  153. * 2. Change font properties to `inherit` in Safari.
  154. */
  155. ::-webkit-file-upload-button {
  156. -webkit-appearance: button; /* 1 */
  157. font: inherit; /* 2 */
  158. }
  159. /**
  160. * Remove the inner border and padding of focus outlines in Firefox.
  161. */
  162. :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focus-inner {
  163. border-style: none;
  164. padding: 0;
  165. }
  166. /**
  167. * Restore the focus outline styles unset by the previous rule in Firefox.
  168. */
  169. :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focusring {
  170. outline: 1px dotted ButtonText;
  171. }
  172. /**
  173. * Remove the additional :invalid styles in Firefox.
  174. */
  175. :where(:-moz-ui-invalid) {
  176. box-shadow: none;
  177. }
  178. /* Interactive
  179. * ========================================================================== */
  180. /*
  181. * Add the correct styles in Safari.
  182. */
  183. :where(dialog) {
  184. background-color: white;
  185. border: solid;
  186. color: black;
  187. height: -moz-fit-content;
  188. height: fit-content;
  189. left: 0;
  190. margin: auto;
  191. padding: 1em;
  192. position: absolute;
  193. right: 0;
  194. width: -moz-fit-content;
  195. width: fit-content;
  196. }
  197. :where(dialog:not([open])) {
  198. display: none;
  199. }
  200. /*
  201. * Add the correct display in all browsers.
  202. */
  203. :where(summary) {
  204. display: list-item;
  205. }