Runde Ecken

am 26.09.2006 - 10:11 Uhr in
Runde Ecken sind ein beliebtes Designelement, das auch von DrupalCenter.de verwendet wird. Es gibt verschiedene Möglichkeiten, wie man Boxen mit abgerundeten Ecken erzeugen kann; auch in diesem Forum sind solche aufgezeigt.
Mir lag daran auszuprobieren, wie man mit den CSS-Pseudoelementen before und after runde Ecken zu Boxen erzeugen kann. Ich habe dieses an der schrittweisen Gestaltung von Blöcken auf unserer PreetzLUG-Seite einmal durchgespielt.
Mir lag vor allem daran, die strenge Scheidung von Inhalt und Darstellung, wie sie eigentlich von Drupal vorgegeben ist, beizubehalten und keine Änderungen bei der Ausgabe des Quelltextes vorzunehmen. Der Firefox beherrscht die CSS-Pseudoelemente, der IE jedoch nicht; da wir uns nur open source verpflichtet fühlen, haben wir darüber hinweggesehen.
Erich
- Anmelden oder Registrieren um Kommentare zu schreiben
Dafür gibt es mehrere
am 26.09.2006 - 10:31 Uhr
Na das ist mal ein schicker Ansatz. Es gibt aber auch Cross-Browser-Lösungen, die mit dem Standard-Drupal-Code funktionieren z.B.
CSS-Basiert:
http://www.alistapart.com/articles/slidingdoors/
JavaScript-JQuery-Basiert:
http://methvin.com/jquery/jq-corner-demo.html
Die hier auf Drupalcenter genutzte ist keine davon und zudem nicht die eleganteste ;)
--
sanduhrs - drupalcenter
-----------------------
http://erdfisch.de
Weitere Anleitungen
am 22.11.2008 - 09:47 Uhr
Hallo,
im Buch "Bulletproof Webdesign" gibt es auch Anleitungen für runde Ecken.
Mich würde mal interessieren, ob sich diese Anleitung auf für Drupal so übernehmen lassen.
Viele Grüße
Barrierefreies Webdesign
Marita Betz
erich schrieb Mir lag vor
am 22.11.2008 - 11:25 Uhr
Mir lag vor allem daran, die strenge Scheidung von Inhalt und Darstellung, wie sie eigentlich von Drupal vorgegeben ist, beizubehalten und keine Änderungen bei der Ausgabe des Quelltextes vorzunehmen.
Versteh ich nicht ganz, was du da erreichen willst?
Du machst das so oder so in Kontext eines Themes und hast wohl Garland benutzt. Das Block Template zu änder geht konform mit dem Ablauf von Drupal und ändert nichts am Core.
Wenn du das so baust, das der IE das nicht kann, verlierst du immer noch mindestens 60% der Benutzer...
Wenn du das schon mit CSS 3 Selectors machen willst, dann nimm lieber JQuery, da verlierst du "nur" ca. 10% und kannst es unintrusiv machen, also für die ohne JS sind die Ecken dann halt eckig.
Falls euch noch mehr Hacks interessieren:
http://www.smileycat.com/miaow/archives/000044.php
---
Viele Grüße,
Kars-T