Sometimes, we want to vertical-align an inline block in a line of text with CSS.
In this article, we’ll look at how to vertical-align an inline block in a line of text with CSS.
How to vertical-align an inline block in a line of text with CSS?
To vertical-align an inline block in a line of text with CSS, we set the vertical-align
property.
For instance, we write
<p>
Some text <code>A<br />B<br />C<br />D</code> continues afterward.
</p>
to add the code element.
Then we write
code {
background: black;
color: white;
display: inline-block;
vertical-align: middle;
}
to add vertical-align: middle;
to vertically center the text in the code element.
Conclusion
To vertical-align an inline block in a line of text with CSS, we set the vertical-align
property.