Discussion :

[gangstarrr]

Bonjour,

J'explique mon probléme, j'aimerais que mon texte principale qui est sur fond blanc passe par dessus une image. En fait j'ai rajouté une image en haut a droite mais le texte ne passe pas par dessus cet image mais dessous.

merci de m'indiquer quelle sont les propriétés css à mettre pour que ça marche.
Voici mon code:

css:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
#contenu{
position: relative;
width:800px;
margin-left:auto;
margin-right:auto;
 
 
padding-top:30px;
padding-bottom:90px;
 
}
#contenu_image{
 position: absolute;
height: 256px;
width: 256px;
background-image: url("../images/monde.png");
background-repeat:no-repeat;
left: 740px;
top: -0px;
 
 
}

html:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
 
<div id="contenu">
			<div id="contenu_image"> </div>
 
<p> bla bla plein de texte <p>
 
</div>

[Deallyra]

Bonjour,

N'oublies pas les balises bbcode [ code] [ /code] pour mettre ton code en valeur et couleur.

Il est possible de jouer avec les propriétés z-index pour faire passer un élément sur/sous un autre

[gangstarrr]

Désolé, sinon pour z index j'avais testé mais ca n'avait pas fonctionné mais vu que je ne sait pas trop comment ca fonctionne je l'ai probablement mal fais.??

[mLk92]

Il me semble que les z-index doivent être utilisés avec une position (absolute, relative, etc.)

[franculo_caoulene]

Salut,

Essaies un truc dans le genre :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<div id="contenu">
    <p> bla bla plein de texte <p>
</div>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
#contenu{
position: relative;
width:800px;
margin-left:auto;
margin-right:auto;
padding-top:30px;
padding-bottom:90px;
background: #ffffff url("../images/monde.png") top left no-repeat;}
}

[gangstarrr]

merci franculo_caoulene, ta solution fonctionne bien et c'est plus simple en plus j'avais pas pensé à ça.