JSFiddle - React, Tailwind, and code Playground

HTML

<nav>
  <ul>
    <li><a href="#">Mon profil</a></li> 
    <li class="tiret"><a href="#">Liens</a></li>  
    <li class="tiret"><a href="#">Me contacter</a></li>
  </ul>
</nav>

CSS

ul{
  list-style-type: none;
}

ul li{
  float: left;
  margin-right: 10px;
}

ul li a{
  text-decoration: none;
}

ul li a:hover{
  text-decoration: underline;
}

.tiret::before{
  content:'-';
  margin: 0 10px;
}