Login
You're viewing the front-end.social public feed.
  • Nov 7, 2025, 9:21 PM

    New blog post: “Fixing Baselines”.

    blog.kizu.dev/fixing-baselines/

    Do you know how to center things in CSS? In year 2025? Easy! You just… align… or justify…, ok, maybe just place? your content… or items? …Forget it, this post is not about alignment. Or is it?

    This post is about another common alignment concept that might seem simple: baseline alignment. In it, I share a technique I have already used for twelve years.

    💬 3🔄 19⭐ 35

Replies

  • Nov 7, 2025, 9:23 PM

    Mentioned in the post: @crackofdusk, who wrote about a solution similar to my technique in 2022.

    💬 0🔄 0⭐ 1
  • Nov 7, 2025, 9:47 PM

    @kizu

    I would never have found such a solution !
    In fact I wasn't even aware of that "first baseline set” thing !! Thanks for the learning.

    I suppose in such a situation I would have ended adding a "vertical-align: middle" to the button...

    💬 1🔄 0⭐ 1
  • Nov 7, 2025, 9:50 PM

    @villapirorum Yep, I often see the “solution” of adding `vertical-align` and then adding a magic-number negative margin to align stuff further :D

    💬 0🔄 0⭐ 0
  • 💬 1🔄 0⭐ 1
  • Nov 7, 2025, 11:20 PM

    @kizu Shame that replacement content can’t have pseudo-elements, `img::before` could cover a multitude of sins without needing empty elements.

    And I still don’t get what `display: run-in` was ever supposed to be about 🤷‍♂️

    💬 0🔄 0⭐ 0