title: Has anyone else encountered a glitch with CSS Grid and odd-number pixel dimmed cells? Trying to fix
body: <p>I needed to create a dynamically sizable grid that would scale and keep its proportions.  This is for use with games and puzzles so think 20 x 25 cells and filling the shortest relative dimension of its container.  After having things work beautifully in Firefox in very straight forward way, I thought to test it in Chrome and Edge (not even gonna try IE).  That's when I found these mysterious rendering lines between cells where the background and cell contents are blended.  Those lines have to go and that's my problem.</p>
  <p>I have all padding, grid gaps, borders and such set to 0.</p>
  <p>Here's what I know:  I anticipated rendering glitches and so my resize handler already tweaks the size of the CSS Grid to round to the nearest whole number of whole number sized (in pixels) cells.  This makes everything look quite clean.  However, when the number of columns is odd (like 21) and the width of the cells turns out odd (like 13px because the total width is 273px) the artifact appears.  The same thing happens independently, vertically.  This seems to be some sort of sub-pixel artifact, but I don't know why it should happen when all sizes are integer pixel count.  If I make the cell count 20 or 22, or resize the grid so the cell dimension is 12 or 14px there is no artifact.  Seems to happen at all odd/odd instances.  Whole integer px sizes for grid and cells alike are confirmed using the console inspector and also screen capture.</p>
  <p>Note, this happens whether contained by the body or another DIV element, and unaffected by whether   any parent container has whole pixel, or % sizing.</p>