You want hairlines between the cells of a 3×3 grid. Two cells have content. Seven are empty. And an empty grid cell has no element, so there is nothing to put border: 1px solid on.

So you fake it. Paint the grid container red, set gap: 1px , give every child a white background, and pad the markup with seven empty divs so the background only shows through the gaps. It works. It's also seven DOM nodes that exist purely to hide paint.

Josh W. Comeau shows that exact workaround in his new post on Interop 2027, and then shows the property that makes it unnecessary. That's the useful way to read his whole list. Most of the ten features he voted for replace something we currently fake.

How the list gets made

Interop is the yearly project where the browser vendors (Comeau names Google, Apple, Microsoft and Mozilla, along with Igalia and Bocoup) agree on a set of focus areas and work on them together.…