JSFiddle - React, Tailwind, and code Playground

HTML

<select>
<option id="1">Small</option>
<option id="2">M_e_d_i_u_m</option>
<option id="3">LAAAAAAAAAAAAAAAAAAARRRRGE</option>
</select>
<span id="hide"></span>

CSS

*{
    font-family:verdana;
    font-size:12px
}
#hide{
    display:none
}

JavaScript

function resize(){
    $("#hide").text($("select").val());
    $("select").css('width',$("#hide").width() + 28);
}

$(function(){
    resize();
    $("select").change(function(){
        resize();
    });
});