Foros del Web » Creando para Internet » CSS »

select dinámicos en una sola linea

Estas en el tema de select dinámicos en una sola linea en el foro de CSS en Foros del Web. Hola, tengo el siguiente problema. Tengo una div a la cual dinámicamente le voy agregando select. Estos select llegan a superar el tamaño de la ...
  #1 (permalink)  
Antiguo 01/07/2011, 09:34
 
Fecha de Ingreso: agosto-2010
Ubicación: Montevideo
Mensajes: 107
Antigüedad: 6 años, 7 meses
Puntos: 3
select dinámicos en una sola linea

Hola, tengo el siguiente problema. Tengo una div a la cual dinámicamente le voy agregando select.

Estos select llegan a superar el tamaño de la div y cuando esto pasa el siguiente select lo coloca abajo del primero y con un scroll vertical. Yo quiero que pasa exactamente lo opusto.

Quiero que el siguente select lo coloque a la izquierda del anterior y el scrool sea horizontal.

selCat es el id de la div contenedora y select es la clase del select.
Código CSS:
Ver original
  1. #selCat{
  2.    
  3.     overflow:auto;
  4.      height:450px;
  5.      
  6.      
  7. }
  8. #selCat .Select{
  9.     width:200px;
  10.     margin:20px;
  11.     overflow:auto;
  12.    
  13. }
Creo que puedo resolver esto con una tabla... pero como quiero empezar a maquetar en css estoy tratando de no usarlas

Desde ya muchas gracias por su tiempo
  #2 (permalink)  
Antiguo 01/07/2011, 10:29
Avatar de ArturoGallegos
Colaborador
 
Fecha de Ingreso: febrero-2008
Ubicación: SLP, México
Mensajes: 5.619
Antigüedad: 9 años, 1 mes
Puntos: 907
Respuesta: select dinámicos en una sola linea

prueba con

Código CSS:
Ver original
  1. #selCat{overflow:auto;height:450px;white-space:nowrap;}
__________________
Toda ayuda se proporciona exclusivamente en el foro, no skype, no mensajes privados u otro medio....
  #3 (permalink)  
Antiguo 01/07/2011, 11:45
 
Fecha de Ingreso: agosto-2010
Ubicación: Montevideo
Mensajes: 107
Antigüedad: 6 años, 7 meses
Puntos: 3
Respuesta: select dinámicos en una sola linea

No no me funciona.. pego el codigo HTML a ver si les doy una idea mejor de lo que trato de hacer

Código HTML:
Ver original
  1. <div style="visibility: visible;" id="div_categoria">
  2.    
  3.     <div id="selCat">
  4.    
  5.     <div id="selCat_0">
  6.    
  7.         <select id="SelectRaiz" class="Select" size="22">
  8.             <option value="1">Alfajores</option>
  9.             <option value="6">Caramelos</option></select>
  10.            
  11.     <div id="selCat_1">
  12.         <select id="Select_1" class="Select" size="22">
  13.             <option value="2">Gustos</option></select>
  14.    
  15.    <div id="selCat_2">
  16.         <select id="Select_2" class="Select" size="22">
  17.             <option value="3">Frutilla</option>
  18.             <option value="4">Narana</option>
  19.             <option value="5">Menta</option></select>
  20.     <div id="selCat_3"></div>
  21.    
  22.     </div></div></div></div>
  23.  
  24.  
  25. </div>

y el css

Código CSS:
Ver original
  1. /*######### Seleccionar Catergoria #####################*/
  2. #div_categoria{
  3.     position: absolute;
  4.     top: 100px;
  5.     left: 200px;
  6.     width: 80%;
  7.     height: 500px;
  8.     background-color:#dfd7d7;
  9.     border-color:#009;
  10.     border-style:groove;
  11.     visibility:hidden;
  12.      white-space:nowrap;
  13.    
  14.  
  15.    
  16. }
  17.  
  18. #selCat{
  19.    
  20.     overflow:auto;
  21.      height:450px;
  22.      white-space:nowrap;
  23.      
  24.      
  25. }
  26.  
  27. #selCat div{
  28.     white-space:nowrap;
  29.     background-color:#390;
  30. }
  31.  
  32.  
  33. #selCat .Select{
  34.     width:200px;
  35.     margin:20px;
  36.     overflow:auto;
  37.     white-space:nowrap;
  38.    
  39. }

Etiquetas: linea, select
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 03:16.