public.mtm (3) [Avatar] Offline
#1
Using the code from the book, the CSS styling does not affect the width of the selectmenu.

      <!-- This has no effect! -->
      <style>
         select { width: 200px; }
      </style>


To control the width of the selectmenu widget, you must set its width option as shown here:

   <body>
      <!-- Your HTML here -->
      <select id="selectmenu">
         <option>One</option>
         <option>Two</option>
         <option>Three</option>
      </select>

      <script src="https://code.jquery.com/jquery-3.3.1.js"></script>
      <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

      <!-- Your JavaScript here -->
      <script>
         // This works...
         // $( "#selectmenu" ).selectmenu().selectmenu( "option", "width", 125);
         //
         // But this is more succint...
         $( "#selectmenu" ).selectmenu({ width: 125 });
      </script>
   </body>