Forum geht's?

Forum geht's?

Erweiterte Suche  
  Seiten: [1]   Nach unten

Autor Thema: Perfekt Box with CSS  (Gelesen 8200 mal)

unknown

  • Bewertung: +0/-0
  • Offline Offline
  • Beiträge: 88
  • yo
Perfekt Box with CSS
« am: Montag - 07. Januar 2008 - 15:51 Uhr »

Diskussionsthread
Thema: Runde Ecken mit CSS

Gesucht wird die 'beste' Möglichkeit runde Ecken in CSS(2) zu gestalten.

Anforderungen:
1) Bilder (soweit benötigt) sind dabei erlaubt.
2) Die rounded Corners müssen auch liquid/opaque/transparent möglich sein.
3) Die entstehende Box soll skalierbar sein.
4) Eine Möglichkeit Schatten darzustellen sollte die 'perfekte' Lösung ebenfalls mitbringen.
5) (mindestens) der Contentbereich soll einen voll skalierbaren Farbverlauf haben
6) Das Ergebnis soll in allen gängigen Browsern stabil und schnell laufen.

Hier eine kleine Beispiel-Box zur Veranschaulichung:
(Transparente Box mit Farbverlauf und Schatten)


Du kannst jetzt selbst ein Bsp. vorschlagen, oder
du testest/kommentierst die schon aufgeführten Möglichkeiten.
Bitte gebt die Namen/Versionen eurer Browser mit an.

Ich stelle hier auch gleich einige vor:
Möglichkeit Nr. 1) :HTM: klick
Möglichkeit Nr. 2) :HTM: klick
Möglichkeit Nr. 3) :HTM: klick
Möglichkeit Nr. 4) :HTM: klick

Zu 1) und 2):
Die Sliding Technik scheint nicht sehr stable zu sein.
Mir wurde schon von "zerrissener" optik berichtet.
Wenn man entsprechend gr. Screen-Resolutions mitbedient (2400*x)
dann dauert der (erstmalige) Ladevorgang entsprechend lange.

Zu 3) und 4):
Scheinen beide 'stable' zu sein.
Nr 4) ist mit einem Haufen CSS-Hacks versehen
(find ich nicht soOO prickelnd)
Schatten scheinen bei beiden nicht möglich.

[Edit]
Hier gibt es noch eine sehr schöne Übersicht zu
den möglichen Technologien (sliding, nifty, etc)
aber welche davon wirklich stable ist, ich hoffe
wir finden es heraus. :HTM: klick zur Übersicht

Dein Wissen/ deine Meinung ist gefragt!

[Edit2]
Ich habe mich jetzt für ein anderes Boxsystem entschieden.
Komplett ohne Bilder, ohne Farbverlauf, ohne Transparenz, ohne Schlagschatten.

Problematik:
- Farbverlauf, Transparenz und Schlagschatten machen Probleme bei der Skalierung
- IE6 unterstützt Transparenz nicht (PNG)
- alle Fixes sind Javascriptbasierend (nee lass mal)^^
- Skalierung wird beim Safari (Mac) nicht korrekt angezeigt

Resume
In einigen Jahren, wenn alle gängigen Browser aktuelles CSS ordentlich interpretieren,
dann wird wohl auch unabhängiges Design möglich sein.
Bis dahin hat man die Qual der Wahl zwischen vielen unsicheren Fixes,
CSS-Hacks, Browser-Bugs, Stable oder Schick etc, etc.
« Letzte Änderung: Montag - 14. Januar 2008 - 12:21 Uhr von a4 »
Gespeichert
2much is not enough ...
  Seiten: [1]   Nach oben
 

+ Schnellantwort