JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<div id="dialog" title="Basic dialog">
    <select id="mySelectBox"><option>Option1</option></select>
</div>

<button id="openDialog" onClick="$('#dialog').dialog('open')">open dialog</button>

CSS

select{
    width:50%;
}

/* the select box gets rendered in 50px */

/* removed the width definition completly and it collapsis to 0px */

JavaScript

$('#dialog').dialog(
    {
        width:600,
		autoOpen:false,
    }
);

$('#openDialog').button();
$('#mySelectBox').selectmenu();