https://bugs.webkit.org/show_bug.cgi?id=72103
Summary: box-shadow creates incorrect shadow when border-radius
is too large
Product: WebKit
Version: 420+
Platform: Other
OS/Version: All
Status: UNCONFIRMED
Severity: Normal
Priority: P2
Component: CSS
AssignedTo: webkit-
ReportedBy:
Created an attachment (id=114649)
--> (https://bugs.webkit.org/attachment.cgi?id=114649&action=review)
Demonstrate border-radius interaction with box-shadow
When using box-shadow and border-radius on an element, the shadow is incorrectly drawn if border-radius's value is larger than the height or width of the element. This occurs in different ways depending on box-shadow's spread's sign. For negative values of box-shadow spread, the resulting shadow is rectangular. Additionally there is a section of the shadow that isn't painted (the element would occupy if it weren't for the rounded border).
If an element uses a large value for border-radius, the value is capped to a the maximum. If it is used along with box-shadow with a negative spread, then instead of the radius being capped it is ignored and a square shadow is created. The border radius' biggest value before it creates a square shadow seems to be the width or height of the element (whichever is smaller) plus the spread.
The radius that triggers the missing shadow regions seems to be equal to the smaller of width or height and doesn't seem affected by the amount of spread.
So for example a width of 500px and height of 200px, a spread of -10px, "border-radius: 0 0 191px 0" will trigger a square shadow, while "0 0 190px 0" will not. "0 0 200px 0" will trigger both the square shadow and the missing region, "0 0 199px 0" will only trigger the square shadow.
--
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.
_______________________________________________
webkit-unassigned mailing list
webkit-
http://lists.webkit.org/mailman/listinfo.cgi/webkit-unassigned
)
