JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
  <li class="right-item" style="float:right;">Text 3</li>
  <li class="right-item" style="float:right;">Text 4</li>
  <li>Text 1</li>
  <li>Text 2</li>  
</ul>

CSS

ul {
  width: 180px;
  background: red;
  padding: 1rem;
  list-style: none;
  overflow: hidden;
}

ul li {
  overflow: hidden;
}
.right-item{
  width: 51%;
}