Bug 44654 – "-webkit-box-shadow" with "inset" on a <tr> element, doesn't render

• Component: CSS
• Status: NEW

[Dave Gregory]

Created attachment 65507 [details]
shows firefox and webkit side by side. Firefox has the correct look.

It renders fine on TR elements without inset.  But add inset and the box shadow dissapears.

The css:
<code>

tr {
  -moz-box-shadow: white 0px 1px 0px 0px inset;
  -webkit-box-shadow: white 0px 1px 0px 0px inset;
  -o-box-shadow: white 0px 1px 0px 0px inset;
  box-shadow: white 0px 1px 0px 0px inset;
}

</code>

[Matthew Sanders]

I've also seen this issue. Its been really annoying. Setting the tr to display:block; fixes the problem. However, reconstructing your table data in block elements is really annoying and near impossible.

[Luke Macpherson]

*** Bug 53110 has been marked as a duplicate of this bug. ***

[Ahmad Saleem]

Created attachment 460074 [details]
Safari 15.5 differs from other browsers

I created a small test case using some code from duplicate bug and then just dumping table from W3Schools <table> and then change the colour to red to make the bug visible.

JSFiddle Link - https://jsfiddle.net/ey7bhwfx/show

As seen in the attached screenshot, I am able to reproduce this bug in Safari 15.5 on macOS 12.4 and it differs from other browsers.

If I am testing it incorrectly and Webkit is aligned with web-spec, please ignore and retest it accordingly. Thanks!

[Ryosuke Niwa]

*** Bug 104008 has been marked as a duplicate of this bug. ***

[Brent Fulgham]

The test case in JSFiddle fails in Safari, works in Chrome and Firefox.

[Radar WebKit Bug Importer]

<rdar://problem/96907111>