New issue
Advanced search Search tips

Issue 855152 link

Starred by 2 users

Issue metadata

Status: Available
Owner: ----
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: ----
Pri: 3
Type: Bug

Blocked on:
issue 377847



Sign in to add a comment

In Blink, table with "width:100%" doesn't get full width of parent, when parent has fractional size (sometimes leaving behind seams/fringes)

Project Member Reported by dholb...@gmail.com, Jun 21 2018

Issue description

Chrome Version: 69.0.3452.0 (Official Build) dev (64-bit)
OS: Win10, Ubuntu 18.04, Mac OS "High Sierra" (tested all three)

What steps will reproduce the problem?
(1) Visit https://jsfiddle.net/eh35yk7o/
(2) Look at the right edges of the blue boxes in the output.
(3) If you like: try zooming in and out.

What is the expected result?
No red should be visible.

What happens instead?
1px-wide red "seams" are visible at the right edge of some of the boxes. They change (i.e. different elements get them) at different zoom levels.

No seams should be present; the blue element has width:100%, so it should fill its container (which is the thing with the red background).

Notes:
- I think this is a pixel rounding issue - it seems to particularly happen when the parent has a fractional pixel value.
- The issue goes away if I remove "display:table", so this seems to be table-specific.
- No other browser exhibits this behavior as far as I've seen. I tested latest Firefox, Edge, and Safari, and didn't see any red in any of them.
- The use case where I ran into this was with tables inside of a flex container (which divides up free space & can easily create sizes with fractional pixels) -- here's my testcase for that (more complex than the one above): https://jsfiddle.net/rdkgsacx/
 

Comment 1 by dholb...@gmail.com, Jun 21 2018

Summary: In Blink, table with "width:100%" doesn't get full width of parent, when parent has fractional size (sometimes leaving behind seams/fringes) (was: In Blink, table with "width:100%" doesn't get full width of parent, when parent has fractional size (sometiems leaving behind "seams"/"fringes"))
Blockedon: 377847
Status: Available (was: Untriaged)
Thanks for the report. When we tackle subpixels in tables (possibly ~years :( ) we'll use this as a test case.

Sign in to add a comment