Ver Mensaje Individual
  #11 (permalink)  
Antiguo 10/01/2012, 08:26
kseso?
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 16 años, 10 meses
Puntos: 539
Respuesta: 5min-Ayuda con z-index

Como esta intro
Cita:
Iniciado por moises_13__35 Ver Mensaje
Os he mostrado un imagen de lo que quiero conseguir.
Os he mostrado el HTML y el CSS.
Os he mostrado un ejemplo de la web.
---Os he mostrado un ejemplo cuando son hermanos que si me funciona. Pero no me gusta el resultado.
---Os he mostrado un ejemplo cuando son padre e hijo que no me funciona.
Y pedia que me ayudaseis a conseguir el aspecto de la imagen, siendo estos PADRE e HIJO.
Aunque no hayais sabido ayudarme enteramente a conseguir lo que pedia...
parece que es en respuesta a
Cita:
Iniciado por kseso? Ver Mensaje
Lo primero es sopesar y elegir el marcado html en función del contenido y de lo que queramos hacer con él.

Lo primero lo desconocemos, Moises no lo ha comentado. Pero me arriesgaré.
Matizo o amplio o explico mejor:
Al planificar el marcado html es básico saber qué contendrán dichas etiquetas y qué pretendemos hacer sobre ellas vía css (en este caso).
Con la información facilitada, que no la he calificado en ningún momento, yo al menos no se si pretende hacer, por ejemplo, un menú desplegable o unas tabs.
De ahí que sugiriese con mucha cautela y como ejemplo de aproximación la posibilidad de crear una lista (ul).

Si ha intentado por activa y pasiva el tema del z-index padre/hijo y en casi todos le funciona menos en firefox, y si su código estuviese libre de errores (pase los validoadores) entonces ya tiene la respuesta. Que el comportamiento yo creo que más que un bug es una cuestión de concepto, ¿puede estar un elemento por debajo (eje z) del que lo contiene? Si el z-index es heredado, esto es, se aplica a la caja declarada y a todo su contenido, si declaramos un nuevo z-index a un hijo ¿el nuevo valor debería modificar al asignado a su padre? Recuerde que en css no hay selector de ascendente.

Si quiere seguir con la estructura padre-hijo sin superponer, hágalo como siempre se han realizado los menús desplegables. Posicionados respecto a su contenedor con el punto exacto (al px).
Y para evitar su ocultación al :hover, también está presente en muchas realizaciones:
Código CSS:
Ver original
  1. .padre:hover .hijo, padre:hover .hijo:hover {display: block; position:...}
por ejemplo.

Complementario:
Hace unas fechas hubo una consulta parecida, no exactamente igual, a la suya:
http://www.forosdelweb.com/f53/z-ind...-texto-967465/

Última edición por kseso?; 10/01/2012 a las 08:32