JSFiddle - React, Tailwind, and code Playground

by Intesar Haider

HTML

<nav>
    <ul>
        <li><a href="#">Page 1</a></li>
        <li><a href="#">Page 2</a></li>
        <li><a href="#">Page 3 is longer</a></li>
        <li class="push-right"><a href="#">Page 4</a></li>
    </ul>
</nav>

CSS

nav ul {
  display: flex;
  margin: 0 -10px;
}
nav li {
    margin: 0 10px;
}
.push-right {
  margin-left: auto;
}