JSFiddle - React, Tailwind, and code Playground

by yijiang

HTML

<ul id="menu">
    <li>Shrink</li>
    <li>Shrink</li>
    <li>Shrink</li>
    <li>Shrink</li>
    <li>Shrink</li>
    <li class="first">Fill</li>
</ul>

CSS

#menu {
    width: 500px;
}

#menu li {
    float: right;
    padding: 5px 10px;
    border-left: 1px solid #333;
}

#menu li.first {
    float: none;
    border: 0;
    text-align: right;
    margin-left: -10px;
}