number - Sangrado de CSS con cfinput type="datefield"

mask input css

Question

Tengo un formulario que usa múltiples <cfinput type="datefield" ...> . Están ubicados de tal manera que el calendario emergente de CSS debería aparecer sobre el campo para otros. Sin embargo, los campos de texto para las otras fechas terminan en frente del calendario.

Esto es solo un problema de IE ya que Firefox y Safari funcionan bien.

¿Hay un simple hack de CSS o alguna otra cosa simple que pueda hacer para que el calendario funcione como debería? Reorganizar el formulario no es muy útil.

Answer 1

IE6 tiene problemas con z-index y algunos tipos de controles. Pruebe esto: http://brandonaaron.net/jquery/plugins/bgiframe/docs/

Answer 2

Mi primera inclinación es intentar agregar un estilo para los campos de texto con un índice z negativo. Alternativamente, puede intentar aplicar un índice Z positivo a la ventana emergente.

El primero sería probablemente más fácil, dada la forma en que las ventanas emergentes se escriben dinámicamente: CF pasa los atributos no reconocidos o no utilizados al navegador, por lo que podría agregar un estilo. Algo como:

<cfinput type="datefiled" name="bob" value="" style="z-index: -1;">

No probado, YYMV.

Answer 3

Bueno, tienes que encapsular tu datefield wirhin a div con ambas posiciones: valor relativo e índice Z, como en:

<div style="position:relative; z-index:3">
<cfinput type="dateField" name="info_dateDebutPub" value="#dateformat(info_dateDebutPub,''dd/mm/yy'')#" mask="dd/mm/yy">
</div>

Definir índice Z dentro de Cfinput no funcionará.

Answer 4

Prueba esto en tu CSS,

para DIV con campos cfinput

position:relative;z-index:0

para Calendar

position:absolute;z-index:1