Skip to content Skip to sidebar Skip to footer

Remove Visible Gaps Between Elements (possible Chrome Defect)

How can I remove the three labelled gaps in the image below? This code is available at http://jsfiddle.net/69zj6smo/ - resize the render area to see that some lines are typically

Solution 1:

This appears to be the result of two or more Chrome defects.

The most noticable of the gaps ("B" in the image), seems to be caused by a defect reported over a year ago here: https://code.google.com/p/chromium/issues/detail?id=241198 (duplicate defect reported here: https://code.google.com/p/chromium/issues/detail?id=306878). Please vote these defects up if this answers your question.

The more subtle issues ("A" and "C" in the image) only appear in Chrome's High DPI mode. It is probably related to this defect: https://code.google.com/p/chromium/issues/detail?id=403955. However, I didn't dig deep enough to ensure I understood that one. Regardless, I'm uncertain why in issue "A" specifically, there would be a visible artifact in the (theoretically continuous) TR at a child (TD) boundary, but that implementation detail would be irrelevant to me if not for the resulting visual flaw.

Post a Comment for "Remove Visible Gaps Between Elements (possible Chrome Defect)"