Snippets.page

Code snippets, tips, how-tos

Align second line of bullet points in CSS


Home » Dev » Align second line of bullet points in CSS

HTML aligns the lines after the first line flush with the bullet point (the dot) instead of the text. You can fix this with the class below.

text-indent property applies only to the first line of a text-block. So we first “pull” the first-line back along with the dot. Then we push the entire text-block including the dot with the margin-left property.

.fix-bullet-align { list-style-position: inside; text-indent: -1em; margin-left: 1em; }
Code language: CSS (css)

Author:

Categories:

Tags:


Leave a Reply

Your email address will not be published.