0
260
Vistasla tarjeta de reacción no muestra el fondo
Agregué una animación en CSS, la idea es que cuando pase el mouse sobre una imagen de comida, me muestre sus detalles como se muestra: 
pero cuando agrego una parte del código de animación css , el fondo de la tarjeta se vuelve transparente.
si elimino el siguiente código, muestra el resultado como se describe en la primera imagen, escribiendo esto da como resultado la segunda imagen
.stars, .twinkling, .clouds { position:absolute; top:0; left:0; right:0; bottom:0; width:100%; height:2400px; display:block; }El resto del código se carga en Github https://github.com/mareyam/Maryam-s-Restaurant
1 Respuestas
Responde la pregunta0
Hay un problema con los valores del índice z, ya que su componente Restaurant no es un elemento secundario de su componente App. Los componentes img tienen un índice z de 999, por eso puedes ver las imágenes del menú. Pero el bloque de detalles a continuación no lo hace. Puedes resolverlo agregando la siguiente regla CSS:
.container-fluid { z-index: 4; }Sin embargo, recomiendo evitar usar demasiado índice z, es muy difícil de mantener. Siempre intente resolver ese tipo de problema con un anidamiento adecuado de sus componentes.