Positioning the underline in text with CSS
Mar 22, 2021
1 minute
Here’s 2 ways to position the underline in text. The easiest way is to use text-underline-offset
. Another way is to put the text in a <span>
or <div>
and use padding-bottom
and border-bottom
. Depending on whether text needs to be inline or not the <span>
or <div>
will need to have position
of inline-block
or block
;
See the Pen 2 ways to adjust the underline of text by James (@jamcgrath) on CodePen.