Foros del Web » Creando para Internet » CSS »

Capa de posicion absoluta y problema con select

Estas en el tema de Capa de posicion absoluta y problema con select en el foro de CSS en Foros del Web. Tengo una capa que esta encima de otra en la otra capa hay select con sus option, al poner una capa encima de esta, los ...
  #1 (permalink)  
Antiguo 22/03/2009, 17:21
Avatar de karlic0s  
Fecha de Ingreso: abril-2007
Ubicación: Cartagena (Murcia)
Mensajes: 241
Antigüedad: 10 años, 7 meses
Puntos: 18
Capa de posicion absoluta y problema con select

Tengo una capa que esta encima de otra en la otra capa hay select con sus option, al poner una capa encima de esta, los select de la capa de abajo salen en la capa superpuesta, pero (como no) solo tengo problema en internet explorer. Alguna solución?

div.capa {
position: absolute;
top:225px;
left:40px;
z-index:100;
height: 500px;
width: 500px;
background-color:#FFFFFF;
border: solid 1px #000000;
}

select {
width: 225px;
border: 0px solid #999;
color: #333;
padding:2px;
font-size:16px;
background-color: transparent
}

Adjunto captura para que me entendais:

  #2 (permalink)  
Antiguo 22/03/2009, 20:39
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: Capa de posicion absoluta y problema con select

la verdad hermano no te entiendo muy bien, podrías ser un poco más claro?
__________________
WFC
codigo82
  #3 (permalink)  
Antiguo 23/03/2009, 05:26
Avatar de karlic0s  
Fecha de Ingreso: abril-2007
Ubicación: Cartagena (Murcia)
Mensajes: 241
Antigüedad: 10 años, 7 meses
Puntos: 18
Respuesta: Capa de posicion absoluta y problema con select

Tengo dos capas, una encima de otra superpuesta con z-index (la de abajo y la de arriba) pues bien, los elementos de la capa de abajo, al poner la otra capa arriba, no se ven (esto es correcto, puesto que la capa de arriba esta superpuesta a la de abajo), me pasa con todos los elementos bien, excepto con los select, que como podeis observar no respetan el z-index de la capa de arriba y solo me pasa en internet explorer, a ver si asi queda mas claro :)
  #4 (permalink)  
Antiguo 23/03/2009, 09:01
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: Capa de posicion absoluta y problema con select

y esto en que versión de ie te pasa?, por que según entiendo tu problema es que la capa de abajo contiene los select's y luego aparece otra capa y tiene que cubrir los select's(esta es la capa que tiene borde rojo), pues creo que no los tapa por que tal vez la capa que tiene que hacerlo no tiene un z-index, mira:
Código html:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  4. <title>Documento sin t&iacute;tulo</title>
  5. <style type="text/css">
  6. .capa {
  7. position: absolute;
  8. top:225px;
  9. left:40px;
  10. z-index:100;
  11. height: 500px;
  12. width: 500px;
  13. background-color:#FFFFFF;
  14. border: solid 1px #000000;
  15. }
  16.  
  17. select {
  18. width: 225px;
  19. border: 0px solid #999;
  20. color: #333;
  21. padding:2px;
  22. z-index:200;
  23. font-size:16px;
  24. background-color: transparent;
  25. }
  26. .super{width:300px; height:300px; position:absolute; z-index:300; background-color:#999;}
  27. </head>
  28.  
  29. <div class="capa">
  30.     <div class="super"></div>
  31.     <select>
  32.         <option>Selecciones</option>
  33.     </select>
  34. </div>
  35. </body>
  36. </html>

o es así o si es ie6 puede que tenga problema con que declares div.capa y no solo .capa o que lo haces sin asignar a otro lugar como ser #cont div.capa.

a ver si es eso lo que necesitas, si no avisas para darle otra solución
__________________
WFC
codigo82
  #5 (permalink)  
Antiguo 23/03/2009, 09:13
Avatar de karlic0s  
Fecha de Ingreso: abril-2007
Ubicación: Cartagena (Murcia)
Mensajes: 241
Antigüedad: 10 años, 7 meses
Puntos: 18
Respuesta: Capa de posicion absoluta y problema con select

Gracias willyfc por tus respuestas, pero he encontrado "la solución" al problema:

Es un error de internet explorer: (fuente: desarrolloweb)
Esto es porque los ciertos componentes de la página (elementos de formulario selec, applet, object, plig-is y en algunos navegadores iframe), son elementos propios del sistema operativo y quedan en algunos casos fuera del control de las hojas de estilo. En inglés le llaman Windowed a estos elementos y Windowless a los otros (la gran mayoría), que sí se pueden editar por completo con CSS.

Poniendole un iframe encima de los select o ocultando estos campos select se soluciona el problema.

Saludos y de nuevo gracias
  #6 (permalink)  
Antiguo 23/03/2009, 09:17
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: Capa de posicion absoluta y problema con select

si acabo de leer eso mira este tema puede que te interese vínculo
__________________
WFC
codigo82
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 08:55.