nicht angemeldet
border-radius Verhalten Firefox/Chrome/Safari: Standard?
Hallo zusammen
Folgender Fall: Ich habe einen border-radius von 30px auf einem div, der border hat eine Dicke von 30px oben und unten, links und rechts ist kein Border.
Hier habe ich jetzt zwei verschiedene Verhaltensweisen:
Firefox 3.6: gibt dem Border oben und unten jeweils zur Innenseite einen geraden Abschluss, nur nach aussen ist der Border gerundet. (So ists auch beabsichtigt)
Google Chrome 9 und auch Safari 5 schneiden den Border im 45° Winkel ab auf allen Seiten.
Welches Verhalten entspricht dem Standard? Ich würde die Aussage im W3C Artikel "The center of color and style transitions between adjoining borders is at the point on the curve that is at an angle that is proportional to the ratio of the border widths. For example, if the top and right border widths are equal, that point is at a 45° angle from the horizontal, and if the top is twice the width of the right the point is at a 30° angle from the horizontal. " applizieren und entsprechend so interpretieren, dass bei einem Topborder:Seitenborder Verhältnis von 100%:0% (sinngemäss) die Variante von Firefox korrekt wäre, oder?
Gruss
-
Welches Verhalten entspricht dem Standard? Ich würde die Aussage im W3C Artikel "The center of color and style transitions between adjoining borders is at the point on the curve that is at an angle that is proportional to the ratio of the border widths. For example, if the top and right border widths are equal, that point is at a 45° angle from the horizontal, and if the top is twice the width of the right the point is at a 30° angle from the horizontal. " applizieren und entsprechend so interpretieren, dass bei einem Topborder:Seitenborder Verhältnis von 100%:0% (sinngemäss) die Variante von Firefox korrekt wäre, oder?
Das ist schwer zu sagen, dass das von dir beschriebene Verhalten ist in der Spezifikation nicht definiert und aufgrund der gegebenen Berechnungsgrundlagen mathematisch nicht herleitbar (division by zero).
Wenn man annimmt, dass du kein 100:0 Verhältnis hast sondern sagen wir 99.99 : 0.01 dann sollte es imo in etwa so aussehen, wie es Firefox jetzt macht. Darum wäre naheliegend, dass 100:0 (wo das Verhalten nicht definiert ist) eben so aussehen soll.
-
Das ist schwer zu sagen, dass das von dir beschriebene Verhalten ist in der Spezifikation nicht definiert
Mann, immer diese Unausgereiftheiten, mühsam...
Wenn man annimmt, dass du kein 100:0 Verhältnis hast sondern sagen wir 99.99 : 0.01 dann sollte es imo in etwa so aussehen, wie es Firefox jetzt macht. Darum wäre naheliegend, dass 100:0 (wo das Verhalten nicht definiert ist) eben so aussehen soll.
Interessanterweise kriegen Chrome und Safari den Übergang sowieso nicht hin: Das Bild ist wie gewünscht, wenn man den Seitenbordern eine (im Prinzip unsichtbare) Breite von 0.1px gibt. Aber wenn man dann noch die Farbe dem Hintergrund des divs gleichsetzt, dann ist Firefox wieder der einzige, der den Übergang entsprechend dem Verhältnis setzt. (Was allerdings - da nicht fliessend - auch nicht sonderlich schön daherkommt)
-
Google Chrome 9 und auch Safari 5 schneiden den Border im 45° Winkel ab auf allen Seiten.
Ich stelle gerade fest, dass Chrome und Safari nur vom Firefox abweichen, wenn man den Seitenborder komplett entfernt (style:none). Setzt man die Breite auf 0, zeigen sie das exakt gleiche Verhalten wie Firefox.
-
-