Force list bullets inside the container

ul {
   list-style-position: inside;
}

Sometimes it can be quite confusing that the bullets before the list items are placed outside the container by default. The easiest solution to this is to set the list-style-position CSS property to inside .

The disadvantage of this solution is that if the text consists of multiple lines, the additional lines will be aligned to the bullet and not to the text.