JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li><p>25%</p>
    <li>25%2% 25%25%25% 25%2% 25%25%25%  25%2% 25%25%25% 25%2% 25%25%25%
    <li>25%
    <li><p>25%<br>еще текст</p>
    <li>25%
    <li>25%
    <li>25%
    <li>25%
    <li>25%
    <li><p>25% 100500</p>
<li>25%
    <li>75%
    <li>25%
    <li><p>25% 100500</p>
    <li>25%
    <li><p>25% 100500</p>
<li>25%
    <li>75%
    <li>25%
    <li><p>25% 100500</p>    <li>75%
    <li>25%
    <li><p>25% 100500</p>
</ul>

CSS

ul{
    overflow:hidden;
    margin:0;
    padding:0;
    list-style:none;
    border:1px solid red;
}

li{
    display:inline-block;
    width:20%;
    position:relative;
    margin-bottom:37px;
    vertical-align:bottom;
}



li:nth-child(4n+1):after{
content:'';
position:absolute;
left:0px;
bottom:-37px;
width:1000%;
height:37px;
background: url(http://s.thumbs.canstockphoto.com/canstock7014385.jpg) 0 100% repeat-x;
}

li:last-child:after{
content:'';
position:absolute;
right:-1000%;
bottom:-37px;
width:10000%;
height:37px;
background: url(http://s.thumbs.canstockphoto.com/canstock7014385.jpg) 0 100% repeat-x;
z-index:-1;
}


li:nth-child(n+13){
width:10%;
}