Bug 140371

Summary: elements with display:table and width:100% show 1px flickering if parent width uses non static unit
Product: WebKit Reporter: Simone Rescio <info>
Component: CSSAssignee: Nobody <webkit-unassigned>
Status: NEW ---    
Severity: Minor CC: hunter_spawn, xously, zalan
Priority: P4    
Version: 528+ (Nightly build)   
Hardware: All   
OS: All   
Attachments:
Description Flags
CSS table 1px width flickering none

Description Simone Rescio 2015-01-12 13:23:19 PST
Created attachment 244461 [details]
CSS table 1px width flickering

An element that uses a display value belonging to the "table" family, when seting width to 100% it won't honor randomly for 1px to fill the width of its parent, if the parent itself has a variable unit type as width,
this is noticeable especially in case of animations,

probably it's a subpixel rounding issue that happens only with table algorithm but not with any other display type,
same behavior happens on Blink as well

screencast of demo attached
code demo : http://codepen.io/srescio/pen/gbgXod
Comment 1 Maxime Lapointe 2020-11-28 11:17:15 PST
I don't believe the parent having a variable unit matters, or maybe not anymore. I tested this in chrome 84 and 87, on Windows, Ubuntu and MacOS

In my less awesome demo here. A table inside a div that has a fixed width doesn't take the full space either (Thats the green line below)

You can compare the width of the sibling div in red which takes the full space. They don't line up in Chrome.

https://jsfiddle.net/HellzStormer/7nbuqop5/15/

Note, if they do line up, that may be luck. Try zooming/unzooming.

Any chance this could be looked at?