How can I give margin to ::marker?

Viewed 2151

ul li {
  list-style-type: '-';
}
<ul>
   <li>Mapping of Product</li>
</ul>

This is my code. After this, I get markers like it's shown in the image below

enter image description here

So I want to have a margin between "-" and text, but the margin does not work properly.

2 Answers

Its not a margin between the list-style-type and the text. It is the padding-left that controls it.

ul li {
  list-style-type: '-';
  padding-left: 20px;
}
<ul>
  <li>Mapping of Product</li>
</ul>

Just include a space after the - (within the quotes):

ul li {
  list-style-type: '- ';
}
<ul>
   <li>Mapping of Product</li>
   <li>Mapping of Product</li>
   <li>Mapping of Product</li>
</ul>

Related