Bug 226218
| Summary: | box-shadow does not work on input elements | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Bramus <bramus> |
| Component: | Forms | Assignee: | Nobody <webkit-unassigned> |
| Status: | NEW | ||
| Severity: | Normal | CC: | 2843035794, akeerthi, cdumez, simon.fraser, webkit-bug-importer, wenson_hsieh |
| Priority: | P2 | Keywords: | InRadar |
| Version: | Safari Technology Preview | ||
| Hardware: | Unspecified | ||
| OS: | Unspecified | ||
Bramus
See demo at https://codepen.io/bramus/pen/1e6d158c6aa97efea1436e36dafa283b
Problem: The box-shadows on the inputs are not rendered.
Tested with Safari TP 124 on macOS 11.3.1
For comparison, behavior in other browsers:
- Chrome: Renders both correctly
- Firefox: Renders only the regular one as expected
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Bramus
Relevant Firefox bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1406017
Note that in Firefox you can get it working by explicitly setting a background-color on the inputs. This workaround does not work with Webkit.
Simon Fraser (smfr)
If you set -webkit-appearance: none; we will draw the box shadow.
Radar WebKit Bug Importer
<rdar://problem/78709285>
Fujii Hironori
*** Bug 242893 has been marked as a duplicate of this bug. ***