41 lines
639 B
CSS
41 lines
639 B
CSS
@layer demo {
|
|
p {
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: 3;
|
|
-webkit-box-orient: vertical;
|
|
overflow: hidden;
|
|
max-inline-size: 40ch;
|
|
}
|
|
|
|
html:has(input[type=checkbox]:checked) p {
|
|
text-wrap: balance;
|
|
}
|
|
}
|
|
|
|
@layer demo.support {
|
|
* {
|
|
box-sizing: border-box;
|
|
margin: 0;
|
|
}
|
|
|
|
html {
|
|
block-size: 100%;
|
|
color-scheme: dark light;
|
|
}
|
|
|
|
body {
|
|
min-block-size: 100%;
|
|
font-family: system-ui, sans-serif;
|
|
|
|
display: grid;
|
|
place-content: center;
|
|
gap: 1rem;
|
|
}
|
|
|
|
label {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
flex-direction: row-reverse;
|
|
gap: 1ch;
|
|
}
|
|
} |