JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<ul>
<li><div class="div1">
<a href="/a" class="one">a</a>
<a href="/b" class="two">b</a>
<a href="/c" class="three">c</a>
</div>
<div class="div2">X</div></li>
</ul>
</body>
CSS
li
{
width:100%;
}
li a.one
{
float:left;
background:red;
}
li a.two
{
float:left;
background:pink;
}
li a.three
{
display: block;
background:green;
}
li div
{
display: inline;
}
.div2
{
float: right;
}