nicht angemeldet
CSS - Ecken mit border?
Matthias Scharwies
CSS - Ecken mit border?
Matthias Scharwies
Gunnar Bittersmann
MudGuardGuten Morgen,
wie würdet ihr solche Ecken denn mit CSS realisieren?
Früher hatte ich sowas mal mit je zwei Pseudoelementen für aside und die h3 gemacht.
Gibt es eine elegantere Lösung? Evtl. auch mit nur zwei gegenüberliegenden Ecken?
Vielen Dank im Voraus für eure Überlegungen und Antworten.
Herzliche Grüße
Matthias Scharwies
--
Die Signatur findet sich auf der Rückseite des Beitrags.
Die Signatur findet sich auf der Rückseite des Beitrags.
-
@@Matthias Scharwies
wie würdet ihr solche Ecken denn mit CSS realisieren?
Bei der CSS Battle gibt es einen (inzwischen vielleicht auch zwei oder drei), der immer wieder was mit
border-imagehinzaubert. Ich könnte mir vorstellen, dass das auch hier der Zaubertrick ist.Ich werd die Frage mal an Ilya & Co. weiterleiten.
Kwakoni Yiquan
--
Ad astra per aspera-
Servus!
@@Matthias Scharwies
wie würdet ihr solche Ecken denn mit CSS realisieren?
Bei der CSS Battle gibt es einen (inzwischen vielleicht auch zwei oder drei), der immer wieder was mit
border-imagehinzaubert. Ich könnte mir vorstellen, dass das auch hier der Zaubertrick ist.Ich werd die Frage mal an Ilya & Co. weiterleiten.
Danke! (Es gab mal nen Artikel von Lea-Verou über das fiktive
border-corner-shape)Kwakoni Yiquan
Herzliche Grüße
Matthias Scharwies
--
Die Signatur findet sich auf der Rückseite des Beitrags.-
@@Matthias Scharwies
(Es gab mal nen Artikel von Lea-Verou über das fiktive
border-corner-shape)Abgesehen davon, dass ihre Idee nie implementiert wurde (AFAIK), hätte das hier auch nicht geholfen.
Kwakoni Yiquan
--
Ad astra per aspera
-
-
@@Gunnar Bittersmann
border-imageDamit geht’s vermutlich einfacher. Was aber auch geht: Einen Rahmen drumrum und die nicht gewünschten Stellen ausschneiden: Corners.
Kwakoni Yiquan
--
Ad astra per aspera-
@@Gunnar Bittersmann
Was aber auch geht: Einen Rahmen drumrum und die nicht gewünschten Stellen ausschneiden: Corners.
Die Lösung hat den Charme, dass sie auch mit rounded corners (wah wah) funktioniert: Corners 1.1.
Kwakoni Yiquan
--
Ad astra per aspera-
Servus!
@@Gunnar Bittersmann
Was aber auch geht: Einen Rahmen drumrum und die nicht gewünschten Stellen ausschneiden: Corners.
Die Lösung hat den Charme, dass sie auch mit rounded corners (wah wah) funktioniert: Corners 1.1.
Alles sehr cool! Vielen Dank!
Melde mich morgen ausführlicher!
Kwakoni Yiquan
Herzliche Grüße
Matthias Scharwies
--
Die Signatur findet sich auf der Rückseite des Beitrags.
-
-
-
@@Gunnar Bittersmann
Bei der CSS Battle gibt es einen (inzwischen vielleicht auch zwei oder drei), der immer wieder was mit
border-imagehinzaubert. Ich könnte mir vorstellen, dass das auch hier der Zaubertrick ist.Irgendwann muss ich das ja auch mal lernen. Erster Versuch: Corners 3.
Conic-gradients verworfen und @MudGuard’s[1] Idee mit SVG aufgegriffen. Rounded corners, wah wah.
Kwakoni Yiquan
--
Ad astra per aspera
Ich weiß, dass da eigentlich kein Apostroph hinkommt. Aber irgendein Trennzeichen muss da ja hin. U+2060? ↩︎
-
-
Hi,
wie würdet ihr solche Ecken denn mit CSS realisieren?
für jede Ecke ein Hintergrundbild (svg mit 2 Linien)
cu,
Andreas a/k/a MudGuard-
@@MudGuard
für jede Ecke ein Hintergrundbild (svg mit 2 Linien)
Oder conic-gradient: Corners 2.
Kwakoni Yiquan
--
Ad astra per aspera
-