Estoy tratando de limitar el tamaño de la opción según el tamaño del campo (seleccionar), para no salir de la página o incluso de la ventana del navegador. ¿Hay alguna forma de controlarlo?

Traté de limitar con ancho y ancho máximo, pero no pude. Acabo de lograr aplicarlo en la selección.

 <select class="form-control" data-val="true" data-val-number="The field IdProduto must be a number." data-val-required="O campo IdProduto é obrigatório." id="Status" name="IdProduto" style="width: 120px"> <option value="">&lt; Selecione &gt;</option> <option value="4">TESTE PRODUTO COM NOME MUITO GRANDE PARA DROPDOWN</option> </select>

select no recibe ninguna modificación de javascript y css.

Campo "Producto" con menú desplegable más grande que el campo

Y una pregunta adicional: cuando uso el modo de respuesta del navegador, la pantalla desplegable es diferente. ¿Me podrías explicar por qué? Que yo sepa, en móvil y tablet se muestra un "modal" con las opciones a seleccionar.

Menú desplegable en modo receptivo