2 hours into css and i still cant figure out how to vertically center this h1 😑🔫

Search on google dude. Or use the center tag in html (theoretically deprecated , but works)

Done that. Everyone uses creepy hacks.. with translate and so on..

Found a solution that works and isnt hacky

(On the container)
display: flex;
align-items: center;

@liverreich
<center> works only horizontally i think

@JaggerJo oh . Sorry

@liverreich
No probkem, dude.

When working with css i always fi d hacky sokutions...

@JaggerJo yeah flex the shit out of them.

@cahva
I guess flexbox is actually the best thing ever happend to css..

Flexbox finally has great support :-) do that.

Otherwise if you know the height of the h1:

position: absolute
top: 50%
margin-top: -HALF_HEIGHT px

Seems css is a challenge for a lot of devs. It was not supposed to be this way in the beginning.

Flexbox!

10 years of web developing and I still have to google everything css

Try this mate https://css-tricks.com/centering-cs...

Use Flexbox, no hacks with center, vertical-align, pos:abs and so on necessary

Flexbox!

@coleever
Purrrrrfect!

Three years into css.
Is that even possible?🤔

@SithLord you could always use calc.

U should seriously consider using flexbox it will make your life about 1000 times easier

@SithLord if only css3 needed but flexbox not supported, this should do the trick:
position: absolute;
top: 50%;
transform: translateY(-50%);

@aralum
Yes this would work, but would be a hach in my opinion

Depends exactly where you need to centre it. But if it's one line high and within a div I do love the old: line-height:$heightOfDiv

The irony of a rant about alignment ending up misaligned 😂

@JaggerJo There are no "hacks" in CSS, since browser support is still horrible today people use those "hacks" to get stuff done. Flexbox has good support but good support is sometimes not enough. Especially if your client forces IE...