JSFiddle - React, Tailwind, and code Playground

by momenelkamri

HTML

<ul>
<li><a href="#">dasdasdas sadasda asdasdas asdasda</a></li>
<li><a href="#">dasdasdas sadasda asda</a></li>
<li><a href="#">dasdasdas sadasda asdas asdasda sadasd</a></li>

<li><a href="#">dasdasdas sadasda asdasdas asdasda</a></li>
<li><a href="#">dasdasdas sadasda asda</a></li>
<li><a href="#">dasdasdas sadasda asdas asdasda sadasd</a></li>

<li><a href="#">dasdasdas sadasda asdasdas asdasda</a></li>
<li><a href="#">dasdasdas sadasda asda</a></li>
<li><a href="#">dasdasdas sadasda asdas asdasda sadasd</a></li>

</ul>

SCSS

ul {
  list-style: none;
  margin: 1rem;
  padding: 1rem;
  
  column-count: 3;
  
  li {
    padding: 0 1rem 0 0;
    
    a {
      text-decoration: none;
      
      
      &:hover {
        text-decoration: underline;
      }
    }
  }
}