Found a site where the whole layout is held together by negative margins

I was poking around a local bakery's menu page on my phone and the desktop version looked fine, but on mobile every single card was overlapping into the next one like a game of CSS dominoes. Turns out they used negative margins on like 6 different nested containers to center things instead of flexbox or grid. Anyone else run into a fix that just makes everything worse?

2 comments

2 Comments

keith_henderson4d ago

Oh man I feel your pain, I once fixed a site's spacing by adding margins and somehow created a 200px horizontal scroll on every page!

diana_bell744d ago

Ha, yep that sounds about right! I used to think CSS was super straightforward until I spent three hours fighting a single overflow issue. It's wild how one little change can mess up the whole layout and you gotta track it down line by line.