select se superpone con capa superior

AlZuwaga · #1 (**permalink**) 19/05/2004, 13:42

Bueno, no sé si este tema de es CSS o de qué.. pero la pregunta es:

Cómo se hace para que un <select> no quede por arriba de un <div> como se ve en la imagen?

JavierB · #2 (**permalink**) 20/05/2004, 01:12

Hola, dazuaga.

Esa es la pregunta del millón. ¿O era la que se ha preguntado un millón de veces? Bueno, lo cierto es que no se puede hacer nada con Css, los select son muy suyos y siempre quedan por encima.

De todas formas, te dejo en enlace a una página que he encontrado hace poco. Me parece que utilizan un div para simular el select y poder poner otro div encima.

Espero que te sirva de ayuda. Saludos,

kahlito · #3 (**permalink**) 20/05/2004, 09:30

JavierB, me has dejado con la miel en los labios

¿Hay enlace para hecharle un vistazo?

Saludosss

JavierB · #4 (**permalink**) 20/05/2004, 10:15

Hola, kahlito.

Si que hay un enlace y debería haber salido en mi primer mensaje si mi mala cabeza no hubiera hecho de las suyas. Allá vaaaa...

http://slayeroffice.com/code/dhtml_select.html

Saludos,

AlZuwaga · #5 (**permalink**) 20/05/2004, 10:27

select mascalzone, filio di putana!

La solución de usar el "DHTML Psuedo Select" me parece un tanto complicada. Me parece que voy a hacer que al darle click sobre el "+" anaranjado no sólo se muestre el div de "nuevo intendente" sino que le establezca el height del div de "intendete actual" a 0 px y listo.

Gracias por la info, JavierB

ChristianDavid · #6 (**permalink**) 27/08/2008, 12:41

buenas tardes, se que llega algo tarde la respuesta pero hace poco me toco voltear mucho para encontrar esta solucion aca la dejo y espero que les sea de aporte a las proximas personas con este problema

Código PHP:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Documento sin t&iacute;tulo</title>

<style>

.select {

    position:absolute;

    z-index:10;/*any value*/

    overflow:hidden;/*must have*/

    width:33em;/*must have for any value*/;

}

.select iframe {

    display:none;/*sorry for IE5*/

    display/**/:block;/*sorry for IE5*/

    position:absolute;/*must have*/

    top:0;/*must have*/

    left:0;/*must have*/

    z-index:-1;/*must have*/

    filter:mask();/*must have*/

    width:3000px;/*must have for any big value*/

    height:3000px;/*must have for any big value*/

}

.select .texto {

    border:solid 1px #aaaaaa;

    padding:12px;

}

</style>

</head>

<body>

<div class="select">

  <div class="texto"> contenido aca </div>

  <!--[if lte IE 6.5]><iframe></iframe><![endif]-->

</div>

<select name="abc" size="6" multiple>

  <option value="1">1</option>

  <option value="2">2</option>

  <option value="3">3</option>

  <option value="4">4</option>

  <option value="5">5</option>

  <option value="6">6</option>

  <option value="7">7</option>

</select>

</body>

</html>

pincho · #7 (**permalink**) 28/08/2008, 13:14

Hermano! esto es un regalo del cielo!
Nunca es tarde... justo HOY me encontre con este problema en mi trabajo y ya me estaba dando por vencido... tu codigo funciona perfectamente.

Muchas Gracias!
Abrazo!