JSFiddle - React, Tailwind, and code Playground

by TekVanDo

HTML

<li style="width:250px"></li>
<li style="width:350px"></li>
<li style="width:450px"></li>
<li style="width:550px"></li>

CSS

li {
    border: 1px solid black;
    height:50px;
}

JavaScript

$('li').each(function () {
    width = $(this).width();
    if (width <= 250) {
        $(this).css("width", "25%");
    }
    else if(width <= 350) {
        $(this).css("width", "33%");
    }
    else if(width <= 450) {
        $(this).css("width", "50%");
    } else {
        $(this).css("width", "100%");
    }
});