How to vertically center in css..

This still blows my mind..

Front End Developer problems😂

So the CSS code I'm working on has a terrible vertical alignment problem on every browser except IE11. Using `display: flex` =_=

I'm not joking this alignment glitch is driving me nuts! Deadline tomorrow.

I don't care what codestyle you want. I even can deal with codestyle I detest. (Looking at you, Vertical Alignment)

There is pretty much only one hard requirement:

It must be enforceable via autoformatting.

I won't manually edit a file because you have a preference.

I've been calling the W3 Consortium every day for the past week leaving the same message:

"Why the fuck doesn't CSS "vertical-alignment" work on all elements?"

Still waiting for them to return my call..

Why do planes crash or never take off? Because vertical-alignment never does what it's supposed to.

Full stack developer.

I know what it's supposed to mean, but I feel like it gives discredit to the devs who perfect their area (frontend, backend, db, infrastructure). It's, to me, like calling myself a chef because I can cook dinner..

The depth, analysis and customization of the domain to shape an api to a website is never appreciated. The finicle tweaks on the frontend to make those final touches. Then comes a brat who say they are full stack, and can do all those things. Bullshit. 99.9% of them have never done anything but move data through layers and present it.

Throw these wannabes an enterprise system with monoliths and microservices willy nelly, orchestrate that shit with a vertical slice nginx ssi with disaster recovery, horizontal scaling, domain modeling, version management, a busy little bus and events flowing all decimal points of 2pi. Then, if you fully master everything going on there, I believe you are full stack.

Otherwise you just scraped the surface of what complexities software development is about. Everyone who can read a tutorial can scrape together an "in-out" website. But if your db is looking the same as your api, your highest complexity is the alignment of an infobox, I will laugh loud at your full stack.

And if you told me in an interview that you are full stack, you'd better have 10+ years experience and a good list of failed and successful projects before I'd let you stay the next two minutes..

Vertical alignment, it's not that hard!!!

CSS Vertical Alignment:

div {
display:flex;
align-items:center;
}

This is not a problem anymore, so can we stop pretending like it is?

!rant
>tfw learnt css when flexboxes exist.
Never struggled with vertical alignment.

Does anyone know if anything special is required to vertically center a div in Firefox?
It works perfectly fine in chrome and IE and Edge and freaking everything else!!

Anyone got any good browser extensions or VS Code extensions for checking vertical / horizontal alignment? Sure I can inject an outline, but want to hook up this functionality to a hotkey...