JSFiddle - React, Tailwind, and code Playground

by Symphony

HTML

<ul>
    <li><span>Anybody text</span><span>1</span></li>
    <li><span>Anybody text 1d</span><span>2</span></li>
    <li><span>Anybody text 1 1d</span><span>3</span></li>
    <li><span>Anybody text 1 1 1d</span><span>5</span></li>
    <li><span>Anybody text 1 1 1 1d</span><span>8</span></li>
    <li><span>Anybody text 1 1 1 1 1d</span><span>13</span></li>
    <li><span>Anybody text 1 1 1 1 1 1d</span><span>21</span></li>
</ul>

CSS

ul {
    width: 500px;
}
ul > li {
    overflow: hidden;
    margin: 2px 10px;
    position: relative;
}
ul > li span:first-child {
    display: block;
    float: left;
}
ul > li span:first-child:after {
    content: '';
    position: absolute;
    width: 100%;
    border-bottom: 1px dotted #888;
    bottom: 0;
    margin-top: 5px;
    margin-left: 5px;
}
ul > li span:last-child {
    display: block;
    position: absolute;
    right: 0;
    background: #fff;
    padding: 2px;
}