| Oof. You are definitely missing the entire point of CSS Grid. CSS Grid is a two dimensional layout tool. Flexbox is one. CSS Grid is for architectural layout. Flexbox is for alignment and flow layout. CSS Grid was enabled across all major platforms by October 2017. You've had two years to figure that out. You want it on IE? Then use CSS Grid's original syntax because Microsoft supported Grid first. The browsers haven't "started implementing some layout tools" --- they literally did it, en masse, in 2017. Grid was available for everyone's use by October. Do yourself a favor and work through the examples here: https://gridbyexample.com/ Do yourself another favor, and stop trying to make different layouts for all the different sizes. Or, go with insanity - your call. Grid is for responsive layout, out of the box; no negative margins, no weird padding, no inane extra workarounds just to get something to line up. Once you understand that CSS Grid is the tool we have been waiting for since the late 90s, and that it, NOT Flexbox, is the sane, maintainable, future-proof layout tool for pages, and then using Flexbox within it to adjust flow and tempo -- you will/can spend a lot more time playing with things for the sake of play, and not for the sake of debugging. Good luck. |