[webkit-dev] Rounded border rendering

Fabian Jakobs fabian.jakobs at 1und1.de
Thu Feb 21 01:41:50 PST 2008


Hi David,
> Please file two bugs on http://bugs.webkit.org/:
>
> - One for the rounded border rendering (with screenshots of both 
> Firefox and
> Safari).
>   
done: <http://bugs.webkit.org/show_bug.cgi?id=17468>

> - One for supporting short-hand notation with -webkit-border-radius.
>   
I am no longer sure about this one. The spec 
<http://www.w3.org/TR/2005/WD-css3-background-20050216/#the-border-radius> 
does not mention shorthand mode for border-radius. I don't even know how 
this is supposed to work since e.g. border-top-right-radius allows two 
values. One for the horizontal radius and one for the vertical radius. 
This would be be eight values for shorthand mode. Firefox can do it 
because they only support one radius per corner.

BTW the documentation for border-radius at 
<http://developer.apple.com/documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html#//apple_ref/doc/uid/TP30001266-BoxModel> 
is incomplete. It does not mention that two radii for each corner can be 
specified.

Best Fabian

> Thanks!
>
> Dave
>
>
> Fabian Jakobs <fabian.jakobs at 1und1.de> wrote:
>
>  
>> Hi,
>>
>> I've been trying to implement cross browser rounded border support 
>> for qooxdoo [1]. One thing I noticed was that webkit renders rounded 
>> borders really strange if the border widths are different. The result 
>> in firefox is much more pleasant. I have attached a small html test 
>> file and screenshots in firefox 3 and webkit to illustrate it. I 
>> couldn't  find any hints in the CSS3 draft of how rounded borders 
>> should be rendered but I think the FF approach looks much better.
>>
>> Another issue is that the '-webkit-border-radius' does not support 
>> the shorthand mode but '-moz-border-radius' does.
>>
>> Is this behaviour intended or should I report this as a bug?
>>
>> Best Fabian
>>
>> -- 
>> Fabian Jakobs
>> JavaScript Framework Developer
>>
>> 1&1 Internet AG
>> Brauerstraße 48
>> 76135 Karlsruhe
>>
>> Amtsgericht Montabaur HRB 6484
>>
>> Vorstand: Henning Ahlert, Ralph Dommermuth, Matthias Ehrlich, Andreas 
>> Gauger,
>> Thomas Gottschlich, Matthias Greve, Robert Hoffmann, Markus Huhn, 
>> Achim Weiss
>> Aufsichtsratsvorsitzender: Michael Scheeren
>>
>>
>>     
> ---------------------------------
>         Border Radius Test                       #round {           
> margin: 30px;           width:
> 100px;           height: 60px;                      border-color: red 
> green blue purple;
>        border-style: solid;           border-width: 5px 10px 20px 
> 10px;                     -moz-border-radius: 40px 10px 50px 
> 20px;           /*
> -webkit-border-radius: 40px 10px 50px 20px;  DOES NOT WORK*/          
> -webkit-border-top-left-radius: 40px;          
> -webkit-border-top-right-radius: 10px;          
> -webkit-border-bottom-right-radius: 50px;          
> -webkit-border-bottom-left-radius: 20px;                      
> background-color:
> gray;       }         
>> _______________________________________________
>> webkit-dev mailing list
>> webkit-dev at lists.webkit.org
>> http://lists.webkit.org/mailman/listinfo.cgi/webkit-dev
>>
>>     
>
>
>
>   


-- 
Fabian Jakobs
JavaScript Framework Developer

1&1 Internet AG
Brauerstraße 48
76135 Karlsruhe

Amtsgericht Montabaur HRB 6484

Vorstand: Henning Ahlert, Ralph Dommermuth, Matthias Ehrlich, Andreas 
Gauger, Thomas Gottschlich, Matthias Greve, Robert Hoffmann, Markus 
Huhn, Achim Weiss
Aufsichtsratsvorsitzender: Michael Scheeren




More information about the webkit-dev mailing list