stop fighting with margins when you have deeply nested cards. if you apply
display: grid
to a parent, your children often lose access to that layout logic. by using
grid-template-rows: subgrid
, the child elements can finally align their internal content to the original tracks. it makes
perfectly aligned headers across different cards trivial to implement without extra wrapper divs.
>it feels like magic once you stop nesting manual heights. **just remember that the parent must also be a grid container for this to work