28173 sujets

CSS et mise en forme, CSS3

Bonjour à vous,

J'ai une div en position absolue, que j'étends sur 50%. Elle est censée passer en dessous d'un document flash (une animation), mais elle se place à chaque fois au dessus.

Du coup, je me retrouve avec une animation flash à moitié visible, recouverte par une div qui devrait être invisible là ou est l'animation ...


Le bandeau qui se répète sur 50% :
#bandeau {
    background: transparent url(../images/back_04.gif) repeat-x top left;
    height: 275px;
    left: 0px;
    position: absolute;
    top: 74px;
    width: 50%;
}


le bandeau qui contient la div et le flash
#header {
	background-color: #34332e;
	margin: 0em;
	padding: 0em;
	text-align: center;
}


le document flash, avec le fond
    #header #flash{
        background: transparent url(../images/back_06.gif) repeat-x top left;
        height: 275px;
    }


Visible à : http://t2m-interim.nuxit.net/index.php5?page=140

J'ai testé avec les z-index, mais ça ne fonctionne pas mieux ...

Merci de votre aide.
Modifié par mcorgnet (07 Sep 2007 - 11:22)
Bonjour,

Pourquoi ne pas tout simplement placer l'animation Flash dans deux blocs imbriqués, avec chacune une image de fond (la première en repeat-x, et la seconde en no-repeat et background-position: 50% top; par exemple)?

Ceci dit, le z-index reste également une solution, qui marche très bien.

Pour rappel, la propriété z-index n'a d'effet que sur les éléments positionnés (valeur de la propriété position autre que "static").
div#bandeau {position: absolute; z-index: 1;}
div#flash object {position: relative; z-index: 2;}