JSFiddle - React, Tailwind, and code Playground

by Vladimir Kutepov

HTML

<ul>
  <li>Suspendisse a sapien ac diam egestas facilisis.</li>
  <li>Praesent ut nisi a est varius semper.</li>
  <li>Vivamus placerat velit at nisi bibendum tristique in ac tellus.</li>
  <li>Praesent ullamcorper odio molestie, viverra sem sed, malesuada justo.</li>
</ul>

<ul class="list">
  <li>Suspendisse a sapien ac diam egestas facilisis.</li>
  <li>Praesent ut nisi a est varius semper.</li>
  <li>Vivamus placerat velit at nisi bibendum tristique in ac tellus.</li>
  <li>Praesent ullamcorper odio molestie, viverra sem sed, malesuada justo.</li>
</ul>

CSS

ul {
  padding: 1em 1em 1em 2em;
  margin: 0 0 1em;
  list-style: none;
  outline: 1px dotted;
}

.li {
  margin: 0;
}

ul li::before {
  content: '• ';
  display: inline-block;
  vertical-align: top;
  width: 1em;
  text-indent: 0;
  text-align: left;
}

.list {
  padding-left: 3em;
}

.list li {
  text-indent: -1em;
}