css-community-reset/reset.css at main · schalkneethling/css-community-reset · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
/**
 * A combination of the following resets:
 * https://piccalil.li/blog/a-more-modern-css-reset/
 * https://www.joshwcomeau.com/css/custom-css-reset/
 * https://dbushell.com/2025/09/12/css-reset/
 */

:root {
  /* https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/interpolate-size */
  interpolate-size: allow-keywords;
}

/* Use a more-intuitive box-sizing model. */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Prevent font size inflation */

/* https://kilianvalkhof.com/2022/css-html/your-css-reset-needs-text-size-adjust-probably/ */

/* https://caniuse.com/text-size-adjust */
html {
  /* stylelint-disable-next-line property-no-vendor-prefix */
  -moz-text-size-adjust: none;
  /* stylelint-disable-next-line property-no-vendor-prefix */
  -webkit-text-size-adjust: none;
  /* stylelint-disable-next-line plugin/use-baseline */
  text-size-adjust: none;
  /* https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/scrollbar-gutter */
  scrollbar-gutter: stable;
}

/* Google Translate RTL support */

/* https://dbushell.com/2025/09/12/css-reset/#:~:text=translated%2Drtl */
html.translated-rtl {
  direction: rtl;
}

/* Remove default margin in favour of better control in authored CSS */
body,
h1,
h2,
h3,
h4,
figure,
blockquote,
dl,
dd {
  margin-block-end: 0;
}

/* Set core body defaults */
body {
  /* If supported, inherits the iOS font settings
     More at https://frontendmasters.com/blog/letting-ios-text-size-setting-affect-font-size-on-the-web/ */
  /* stylelint-disable-next-line font-family-no-missing-generic-family-keyword */
  font: -apple-system-body;
  font-size: 100%; /* Respect user choice */
  line-height: var(--minimalist-typography-document-line-height);

  /* fallback for older browsers */
  min-block-size: 100vh;

  /* dynamic viewport block size - https://developer.mozilla.org/en-US/docs/Web/CSS/length#vb */
  /* https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/length#browser_compatibility */
  min-block-size: 100svb;

  /* https://developer.mozilla.org/en-US/docs/Web/CSS/text-rendering#browser_compatibility */
  /* stylelint-disable-next-line value-keyword-case */
  text-rendering: optimizeLegibility;
}

summary {
  cursor: pointer;
}

/* Set shorter line heights on interactive elements */
button,
input,
label {
  line-height: var(--minimalist-typography-interactive-line-height);
}

/* Remove built-in form typography styles */
input,
button,
textarea,
select {
  font: inherit;
}

/* Make sure textareas without a rows attribute are not tiny */
textarea:not([rows]) {
  min-block-size: 10em;
}

/* Balance text wrapping on headings */

/* https://developer.mozilla.org/en-US/docs/Web/CSS/text-wrap#balance */
h1,
h2,
h3,
h4 {
  /* stylelint-disable-next-line plugin/use-baseline */
  text-wrap: balance;
}

/* Improve media defaults */
img,
picture,
video,
canvas,
svg {
  block-size: auto;
  display: block;
  max-inline-size: 100%;
}

/* Anything that has been anchored to should have extra scroll margin */
:target {
  scroll-margin-block: 5ex;
}