#moustache { position: absolute; bottom: 10px; margin: 0 auto; }
If that doesn’t work:
#moustache { position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%); }
Relative positioning is preferred but not always available if the parent face is positioned absolutely.
Edit: adjusted bottom from 0 -> 10px since 0 would be at the bottom of the chin but there is obviously some padding to bring it nearer the lip
I came here to post this and I wouldn’t have clogged up the thread with this useless comment except for your username. I salute you
I refuse to believe that’s CSS. What is that colon at the end even?
It’s a typo. The colon should be a semicolon. But since it’s the last declaration, it’s optional.
I don’t think bottom is a valid value for the position property either.
And yet someone on the internet would unsarcastically comment that just adding flex-box would fix it.
Yep, and
align
isn’t a real property, either.How deep does this rabbit-hole go?!
It’ll just get ignored. I saw a fucking
padding: 0.0.3rem
at work today, and it just broke the one class.
came to hate on this code; it’s not valid lol
Probably on purpose.
Hahaha. First true boisterous laugh of the day. Thanks!
Just use JS and get X Y position of nose and put it a few pixel below. So it would be still valid if the nose moves.
Moustache seems generic for an id, maybe you meant to apply as .moustache? Let’s keep things consistent please
Edit: center also seems unnecessary? in the beta moustaches are already aligned as a child of .facial-hair