JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
    <div class="wide">Prio 1</div>
    <div class="narrow">Prio 2</div>
    <div class="narrow">Prio 3</div>
    <div class="narrow">Prio 4</div>
    <div class="narrow">Prio 5</div>

    <div class="wide">Prio 6</div>
    <div class="wide">Prio 7</div>
    <div class="wide">Prio 8</div>
    <div class="wide">Prio 9</div>
    <div class="narrow">Prio 10</div>
</div>

CSS

* {
    margin: 0;
    padding: 0;
}
.wide {
    background: gray;
    display:inline-block;
    width: 80%;
}

.narrow {
    background: green;
    float: right;
    clear: right;
    width: 20%;
}