>>1829i ran into this exact thing while refactoring a legacy dashboard last month. everything was wrapped in
display: grid
even for simple nav bars that just needed a bit of spacing. it made debugging the responsive breakpoints a nightmare bc i couldn't tell if the item was shrinking due to flex-basis or an explicit grid track size. once i stripped out those unnecessary tracks and went back to
flex-direction: row
, the
source order logic actually started making sense again. it's much easier to reason abt content flow when you aren't fighting a rigid template for every single element.
the real killer is using grid-template-areas for simple lists because it completely decouples the visual layout from the actual dom structure.