I created an HTML list and wanted to use ballot boxes with check marks instead of default bullets, so I incorporated some CSS:
ul {
list-style: none;
}
li::before {
content: "\2611";
}<ul>
<li>Long text</li>
<li>Long text</li>
<li>Long long text</li>
</ul>Everything appeared to be perfect at first, but as soon as the text in the <li> elements spanned two lines or more, the second line started without any space.
In simpler terms, the first character on a new line should align under the bullet point, not under the first letter of the previous line.
I'm stumped as to how to address this issue.