JSFiddle - React, Tailwind, and code Playground

by loupax

HTML

<div class="content" data-x="1">
    This box should have a width of 100px
</div>

<div class="content" data-x="2">
    This box should have a width of 200px
</div>

<div class="content" data-x="3">
    This box should have a width of 300px
</div>

CSS

.content{        
    width: 100px;            
    background: #f00;
}


.content[data-x]{
    width: calc(100px * attr(data-x))
}