[Webkit-unassigned] [Bug 59577] New: if both border-radius and box-shadow applied, shadow is not fully visible

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Tue Apr 26 21:12:06 PDT 2011


https://bugs.webkit.org/show_bug.cgi?id=59577

           Summary: if both border-radius and box-shadow applied, shadow
                    is not fully visible
           Product: WebKit
           Version: 528+ (Nightly build)
          Platform: PC
        OS/Version: All
            Status: UNCONFIRMED
          Severity: Normal
          Priority: P2
         Component: Layout and Rendering
        AssignedTo: webkit-unassigned at lists.webkit.org
        ReportedBy: gajdusek.petr at centrum.cz


Hi,

Have a box with border-radius applied for its top <right|left> and/or bottom <right|left> corners,
be the border-radius length set to the exactly same (or greater) value as the height of the box.

Something like these CSS rules:
#box {
  height: 30px;
  border-radius: 0 0 30px 30px;
}

Now if you apply box-shadow to #box, that shadow is not displayed properly - 
it is not displayed in that box parts that are cut off by border-radius,
instead underlying layer is visible (i.e. body background color).

Lowering the shadow length by single pixel works ok.

Example (XHTML attached):

HTML:
<div id="shadowed_box"></div>

CSS:
#shadowed_box {
  height: 30px;
  border-radius: 30px 0;
  box-shadow: 4px 4px 8px black;
  background-color: red;
}

I had this issue with every webkit version (with border-shadow support) I tried (latest nightly build r84622 including)
on Debian 32bit (chromium, epiphany) and Win7 64bit (google chrome, safari + nightly webkit).

Regards,
Petr

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.



More information about the webkit-unassigned mailing list