@@MudGuard > Die Höhe des Schattens kann man wohl nicht beeinflussen, soweit ich das jetzt kurz zu box-shadow gelesen hab. Die Höhe allein nicht. Mit `<spread-radius>` beeinflusst du Höhe und Breite. > lh ist line-height? Yep. [[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/length#lh)] > Ich hatte es - nach der Anregung mit dem overflow-hidden - auch noch mit border probiert - aber das verschiebt bei zu breiter border-top dann den Text nach unten. Ja. `outline` tut das aber nicht. Was mich auf die vermutlich bessere Idee bringt: Im Gegensatz zum Rahmen, wo man `border-with` für alle vier Richtungen getrennt angeben kann[^border], hat Outline in alle Richtungen dieselbe Dicke. Man kann das Element aber mit `clip-path: polygon(…)` zurechtschneiden: [neuer Fork](https://codepen.io/gunnarbittersmann/pen/yLrwzaw?editors=0100). [^border]: Für oben und unten bietet sich `border-block` an, für links und rechts `border-inline` (bei horizontaler Schreibrichtung), s.a. [TIL about -starting -blocks](https://noti.st/gunnarbittersmann/DQUUos/til-about-starting-blocks) `9in` sollte groß genug sein.[^9in] Wenn nicht, kannst du auch `666in` angeben. Oder `1e9in`. Bei großem Wert brauchst du auch nur 3 Eckpunkte, da die Seiten des Dreiecks dann quasi-parallel verlaufen.[^Dreieck] [^9in]: Den Wert `9in` verwende ich in der [CSS Battle](https://cssbattle.dev) häufig für etwas Großes, wenn es nicht darauf ankommt, wie groß genau. Bspw. `border-radius:0 9in 9in 0` für einen Halbkreis. [^Dreieck]: Auch davon wird in der CSS Battle rege Gebrauch gemacht. > Woher wußte ich eigentlich vorher, daß die Lösung von Dir kommen wird? ;-) Hm, keine Ahnung. Kwakoni Yiquan {:@art-x-kwejian} -- *Ad astra per aspera*{:@la}

@@MudGuard > Die Höhe des Schattens kann man wohl nicht beeinflussen, soweit ich das jetzt kurz zu box-shadow gelesen hab. Die Höhe allein nicht. Mit `<spread-radius>` beeinflusst du Höhe und Breite. > lh ist line-height? Yep. [[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/length#lh)] > Ich hatte es - nach der Anregung mit dem overflow-hidden - auch noch mit border probiert - aber das verschiebt bei zu breiter border-top dann den Text nach unten. Ja. `outline` tut das aber nicht. Im Gegensatz zum Rahmen, wo man `border-with` für alle vier Richtungen getrennt angeben kann[^border], hat Outline in alle Richtungen dieselbe Dicke. Man kann das Element aber mit `clip-path: polygon(…)` zurechtschneiden: [neuer Fork](https://codepen.io/gunnarbittersmann/pen/yLrwzaw?editors=0100). [^border]: Für oben und unten bietet sich `border-block` an, für links und rechts `border-inline` (bei horizontaler Schreibrichtung), s.a. [TIL about -starting -blocks](https://noti.st/gunnarbittersmann/DQUUos/til-about-starting-blocks) `9in` sollte groß genug sein.[^9in] Wenn nicht, kannst du auch `666in` angeben. Oder `1e9in`. Bei großem Wert brauchst du auch nur 3 Eckpunkte, da die Seiten des Dreiecks dann quasi-parallel verlaufen.[^Dreieck] [^9in]: Den Wert `9in` verwende ich in der [CSS Battle](https://cssbattle.dev) häufig für etwas Großes, wenn es nicht darauf ankommt, wie groß genau. Bspw. `border-radius:0 9in 9in 0` für einen Halbkreis. [^Dreieck]: Auch davon wird in der CSS Battle rege Gebrauch gemacht. > Woher wußte ich eigentlich vorher, daß die Lösung von Dir kommen wird? ;-) Hm, keine Ahnung. Kwakoni Yiquan {:@art-x-kwejian} -- *Ad astra per aspera*{:@la}

@@MudGuard > Die Höhe des Schattens kann man wohl nicht beeinflussen, soweit ich das jetzt kurz zu box-shadow gelesen hab. Nur die Höhe nicht. Mit `<spread-radius>` beeinflusst du Höhe und Breite. > lh ist line-height? Yep. [[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/length#lh)] > Ich hatte es - nach der Anregung mit dem overflow-hidden - auch noch mit border probiert - aber das verschiebt bei zu breiter border-top dann den Text nach unten. Ja. `outline` tut das aber nicht. Im Gegensatz zum Rahmen, wo man `border-with` für alle vier Richtungen getrennt angeben kann[^border], hat Outline in alle Richtungen dieselbe Dicke. Man kann das Element aber mit `clip-path: polygon(…)` zurechtschneiden: [neuer Fork](https://codepen.io/gunnarbittersmann/pen/yLrwzaw?editors=0100). [^border]: Für oben und unten bietet sich `border-block` an, für links und rechts `border-inline` (bei horizontaler Schreibrichtung), s.a. [TIL about -starting -blocks](https://noti.st/gunnarbittersmann/DQUUos/til-about-starting-blocks) `9in` sollte groß genug sein.[^9in] Wenn nicht, kannst du auch `666in` angeben. Oder `1e9in`. Bei großem Wert brauchst du auch nur 3 Eckpunkte, da die Seiten des Dreiecks dann quasi-parallel verlaufen.[^Dreieck] [^9in]: Den Wert `9in` verwende ich in der [CSS Battle](https://cssbattle.dev) häufig für etwas Großes, wenn es nicht darauf ankommt, wie groß genau. Bspw. `border-radius:0 9in 9in 0` für einen Halbkreis. [^Dreieck]: Auch davon wird in der CSS Battle rege Gebrauch gemacht. > Woher wußte ich eigentlich vorher, daß die Lösung von Dir kommen wird? ;-) Hm, keine Ahnung. Kwakoni Yiquan {:@art-x-kwejian} -- *Ad astra per aspera*{:@la}