Normally, the baseline of an inline-block is set to its last line, nicely aligning with its neighboring text.

However, after making the inline-block a scroll container (such as by setting a non-visible overflow value), it is instead aligned to its bottom edge. Due to the line's text descent, there is additional spacing appearing below the box.

We can manually adjust the vertical alignment to make sure we remove that additional space. However, it won't perfectly line up the baselines anymore.

Instead of manually adjusting the vertical alignment, we can use 'center' for perfect centering. Note that baselines will still not line up.