Tamaño Width con Dropdown-Menu de bootstrap-select

Complemento usado de: https://developer.snapappointments.com/ llamado Bootstrap-Select también conocido como: bootstrap selectpicker

Cuando tenemos options demasiados largos, nuestra web se distorsiona cuando utilizamos el plugin de bootstrap-select.

Tenemos que el contenido es muy extenso:

Y obtener esto, todo cuadrado al menos en pantallas más cortas a todo el texto:

Lo que tenemos que hacer, al menos para que encaje exacto en el ancho del dispositivo, es poner el CSS siguiente:

.bootstrap-select .dropdown-menu{
   max-width: 100%!important;
}

El código utilizado para obtener el mismo resultado de las imágenes es en el CSS:

#divComboBusqueda .dropdown-toggle{
   color: #495057;
   background-color: #fff;
   background-clip: padding-box;
   border: 1px solid #ced4da;
   border-radius: .25rem;
   transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.bootstrap-select .dropdown-menu{
   max-width: 100%!important;
}

Y del lado del HTML es:

 
Compartir

Sobre el autor:

Picture of Infocat

Infocat

Mi nombre es Carlos A. Pariona Valencia, soy programador, mi equipo y yo contamos con 8 años de experiencia en el campo de Desarrollo de Software y recientemente en Apps.

¿Tú que opinas?

Más contenido que tenemos: