Længlich: Will runde Ecken im Design - nur wie?

Beitrag lesen

Um waynuma?

border-top-left-radius:20px/10px;

-moz-border-radius-topleft:20px/10px;
-webkit-border-top-left-radius:20px 10px;


>   
> Ich hab da mal was [vorbereitet](http://bittersmann.de/tests/border-radius).  
  
Sehr praktisch, danke!  
  

> > Dann kann aus Deiner Sicht nur Opera 10.50 border-radius, womit es noch lang nicht praxistauglich ist.  
>   
> Nein, auch Chrome.  
  
Ah, das wußte ich nicht. Da wird der Rahmen-Artikel im Wiki wohl nochmal überarbeitet werden müssen.  
  

> Wobei Chrome eigenartigerweise 'border-radius: 20px 0' richtig darstellt, '-webkit-border-radius: 20px 0' jedoch nicht. Bei "20px" hat er keine Probleme, bei "20px 0 0 0" auch nicht, und bei "20px 0 / 5px 0" auch nicht. WTF?  
  
Anscheinend entspricht -webkit-border-radius dem Verhalten des Safari, während sich border-radius schon an der aktuellen Version des Standards orientiert. Wie schon geschrieben: Dies ist ein Beispiel, bei dem wir froh sein können, daß die Hersteller erstmal mit ihren proprietären Kürzeln angefangen haben.  
  

> Safari hängt hinterher; er kann weder elliptische Ecken noch verschiedene Ecken noch Prozentangaben.  
  
Elliptische Ecken kann er, siehe [Beispielcode im Wiki](http://wiki.selfhtml.org/wiki/Doku:CSS/Eigenschaften/Rahmen#border-radius_.28Rahmenabrundung.29). Er versteht es nur nicht in der /-Notation, sondern möchte die beiden Werte mit Leerzeichen getrennt bekommen.  
  
Für verschiedene Ecken gibt es -webkit-border-top-right-radius usw., aber wie ich gerade sehe, macht das nur Chrome und nicht Safari. Auch hier ist wohl eine Überarbeitung des Wiki-Artikels nötig.  
  

> Wenn man aber gleich große Kreisbögen an allen vier Ecken möchte und diese in px oder em angibt, steht der Verwendung von 'border-radius' / '-moz-border-radius' / '-webkit-border-radius' nichts im Wege.  
  
Diesem Fazit schließe ich mich an.  
  
Viele Grüße vom Længlich  

-- 
Mein aktueller Gruß ist:  
Hopi (Südwest-USA)