I have these variable-width, overflowing, children in a container.
How could I get the inner spacing without the outer spacing between the children and container?
grid-gap results in this behaviour:
A proper gap, but now fixed width, aligned, cells - which isn't what I want.
What I've thought about doing is using a negative margin to mask this spacing, but this seems hacky
and has a load of side-effects, for example the blue border around the body no longer being visible. It's also still rendering all of the extra space, it would just need to be clipped off by another container with
overflow: hidden, https://codepen.io/tobq/pen/jRKoKw.
first/last-child selectors to remove padding won't work, as there are multiple elements per line. So, for example, removing the final elements margin-bottom won't remove the bottom border, because there are still other elements on the line with a margin-bottom. There's no way - that I know of - to select all elements on the last line.