DHTMLX Docs & Samples Explorer

### Autosize

There is an opportunity to set automatic width and height for the list of combo options.
In this case, the size of combo list adjusts to its content.

| Size: width , height
| enable / disable Auto Height enable / disable Auto Width

Source

    <script>window.dhx_globalImgPath = "../../codebase/imgs/";</script>
    <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxcombo.css">
    <script  src="../../codebase/dhtmlxcommon.js"></script>
    <script  src="../../codebase/dhtmlxcombo.js"></script>
    <script src="../../codebase/ext/dhtmlxcombo_whp.js" type="text/javascript"></script>

    <table>
    <tr>
        <td>
            <div id="combo_zone2" style="width:200px; height:30px;"></div>
        </td>
        <td style="padding-left:40px" align="left">Size: <a href="javascript:void(0)" onclick="z.setOptionWidth(document.getElementById('width1').value)">width</a> <input type="text" id="width1" value="200" size="3"> , <a href="javascript:void(0)" onclick="z.setOptionHeight(document.getElementById('height1').value)">height</a> <input type="text" id="height1" value="200" size="3"></td>
    </tr>
    <tr>
        <td></td>
        <td align="left" style="padding-left:40px" >
        <a href="javascript:void(0)" onclick="z.enableOptionAutoHeight(1)">enable</a> / <a href="javascript:void(0)" onclick="z.enableOptionAutoHeight(0)">disable</a> Auto <b>Height</b><br/>
        <a href="javascript:void(0)" onclick="z.enableOptionAutoWidth(1)">enable</a> / <a href="javascript:void(0)" onclick="z.enableOptionAutoWidth(0)">disable</a> Auto <b>Width</b><br/>
        </td>
    </tr>
    </table>
    <script>var z = new dhtmlXCombo("combo_zone2", "alfa2", 200);
    z.loadXML("../common/data_a.xml");
    z.enableOptionAutoPositioning();</script>