Werden bei Safari & Mobile Safari abgerundete Ränder mit Radius und Auffüllung falsch wiedergegeben?
Safari und Mobile Safari scheinen ein Problem zu haben, wenn Sie Randradius, Padding und Rahmen kombinieren. Funktioniert gut in Chrome und Firefox.
& lt; - Erwartet
& lt; - Safari-Rendering
HTML:
%Vor%CSS:
%Vor%Beispiel: Ссылка
Ist es meine Schuld oder Safaris? Wie würde ich es beheben?
2 Antworten
Ich wette, es ist ein Safari-Bug: border-radius wird zu spät angewendet und erzeugt einen Clipping-Effekt. Glücklicherweise wird box-shadow korrekt gerendert, also benutzen wir es:
Funktioniert auf Safari 6 auf iPad und OS X.
Beste Lösung, die mir gerade einfällt: Ссылка
Verwendet einen Wrapper div, um den Rahmen zu zeichnen und platziert dann das Bild darin. Immer noch ein paar Artefakte am rechten Rand, aber ich vermute, das ist ein Safari-Bug.
HTML
%Vor%CSS
%Vor%Tags und Links css css3 mobile-safari safari padding