NEW221089
Property background-clip: text; does not work on button elements 
https://bugs.webkit.org/show_bug.cgi?id=221089
Summary Property background-clip: text; does not work on button elements
brian.gonzalezp@gmail.com
Reported 2021-01-28 08:41:27 PST
Created attachment 418646 [details] Issue as seen on Safari 14 * Given the HTML: <a>This is an anchor</a> <br /> <button>This is a button</button> * And the CSS: button, a { font-size: 5rem; display: inline-block; color: transparent; background-image: url('https://images.unsplash.com/photo-1579546929662-711aa81148cf?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=1950&q=80'); background-size: 100% 100%; /* Problematic on Safari: */ -webkit-background-clip: text; } Webkit does not seem to respect the background-clip: text; property, when applied to a button tag. This does not seem to be an issue on other major browsers.
Attachments
Issue as seen on Safari 14 (27.78 KB, image/png)
2021-01-28 08:41 PST, brian.gonzalezp@gmail.com 		no flags
Details
Expected (Chrome) (48.03 KB, image/png)
2021-01-28 08:43 PST, brian.gonzalezp@gmail.com 		no flags
Details
Test Case (501 bytes, text/html)
2021-02-15 17:27 PST, Smoley 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
brian.gonzalezp@gmail.com
Comment 1 2021-01-28 08:43:21 PST
Created attachment 418647 [details] Expected (Chrome)
Radar WebKit Bug Importer
Comment 2 2021-02-04 08:42:12 PST
<rdar://problem/73982665>
Smoley
Comment 3 2021-02-15 17:27:23 PST
Created attachment 420403 [details] Test Case
Smoley
Comment 4 2021-02-15 17:30:09 PST
Thanks for filing, I'm reproducing this on Safari 13.1.3 as well as TOT.
Note You need to log in before you can comment on or make changes to this bug.