li::marker

[gyinshuen]

Hi,
I had enlarged li::marker in my CSS file into 1.5em. However, the content of the list goes down after I enlarged the bullet, do we have a way to let the bullet align with the content?

Screenshot 2025-10-09 103528.png

Code: Select all

ul li::marker{
    font-size: 1.5em; /* Increase bullet size */
}

[julien_lacour]

Hello,

To keep the alignment, you should better use an image instead of the original disk:

Code: Select all

ul li::marker {
  content: url("bullet.svg");
}

With the following image for example:

Code: Select all

<svg xmlns="http://www.w3.org/2000/svg" width="10px" height="10px">
    <circle cx="5" cy="5" r="5" />
</svg>

Regards,
Julien