Bug 210539

Summary: Floating-Point CSS height/width percentages not calculated correctly by Safari in Table
Product: WebKit Reporter: info.braden
Component: TablesAssignee: Nobody <webkit-unassigned>
Status: NEW ---    
Severity: Normal CC: ahmad.saleem792, ap, bfulgham, martin.kolb, rniwa, simon.fraser, webkit-bug-importer, zalan
Priority: P2 Keywords: InRadar
Version: Safari 13   
Hardware: Mac   
OS: macOS 10.15   
Attachments:
Description Flags
HTML Examples
none
Simplified Example none

Description info.braden 2020-04-15 01:29:48 PDT 
Created attachment 396512 [details]
HTML Examples

When floating point percentages (which add up to < 100%) are used to specify the height of table rows with 10+ rows, their heights are not calculated correctly and the last elements are rendered on top of each other.

This was reproduced in Safari on macOS (13) and iOS (13 & 12).

Steps to reproduce the problem:
1. Open either of "FloatingPoint_HeightWidthPercentages_CalculatedIncorrectly.html" or "FloatingPoint_HeightWidthPercentages_CalculatedIncorrectly_LowerPrecision.html"
2. Notice that the last two table elements "Unclassified" and "Confidential" are rendered on top of each other.

I have also attached a simplified Table that also reproduces the issue which is easier to see visually.

Note: This is not an issue in Firefox or Non-Chrome-Based Edge.
 
The issue that is present in Safari has the same erroneous behaviour that chrome exhibits here:
https://bugs.chromium.org/p/chromium/issues/detail?id=1068931
Comment 1 info.braden 2020-04-15 01:30:33 PDT 
Created attachment 396513 [details]
Simplified Example
Comment 2 Radar WebKit Bug Importer 2020-04-15 17:13:10 PDT 
<rdar://problem/61857920>
Comment 3 Ahmad Saleem 2022-08-18 09:41:37 PDT 
I am able to reproduce this bug in Safari 15.6.1 on macOS 12.5.1 using "Simplified test case", where the table does not show "Second to last (Number 13)" and "Last (Number 14)" whereas other browsers Chrome Canary 106 and Firefox Nightly 105 do show these two rows. Plus only Safari is showing "Scrollbar" (height was same for all browsers). Thanks!