| Summary: | box-shadow stops working at 2042px spread | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Erik Aigner <aigner.erik> |
| Component: | Layout and Rendering | Assignee: | Nobody <webkit-unassigned> |
| Status: | NEW --- | ||
| Severity: | Major | CC: | andyearnshaw |
| Priority: | P2 | ||
| Version: | 528+ (Nightly build) | ||
| Hardware: | Mac (Intel) | ||
| OS: | OS X 10.9 | ||
Browser: Safari 7.0.1/WebKit Also the element dimensions seem to affect it, since it works with a width/height of 1px. Example http://jsfiddle.net/dKXh8/ I've experienced the same issue, it appears to also depend on the viewport height. For instance, on my MBP retina display (viewport size 1440x589 with the dev tools open) a 727x588 element has a maximum shadow spread of 1018px. On my portrait screen (viewport size 1609x1080) the same element has a maximum shadow spread of 2039px. If the element is draggable, the shadow sometimes appears as you drag it around, but doesn't always render correctly even when it appears. |
box-shadow stops working at a 2042px spread value, if a border-radius is set. div { border-radius: 3px; box-shadow: 0 0 0 2042px rgba(0,0,0,0.2), 0 0 0 3px #aaa; height: 100px; width: 100px; }