Discussion :

[nocy]

Bonjour

jai 3 images et je veux les mettres comme background une en top l'autre au milieu, et la derniere en bas, celle du top et du bas sont fixée

[list]
images/top.gif ---> height:8px;
images/bgtb.gif ---> height 100% ( suit le text )
images/bottom.gif --->height:8px;

feuille de style :

#test1 {
background-image:url(images/top.gif) top no-repeat;
background-image:url(images/bgtb.gif) center no-repeat;
background-image:url(images/bottom.gif) bottom no-repeat;
width:250px;
}

Html:
<div id="directory"><a href="#">liens 1</a><br />
<a href="#">liens 2 </a>
</div>

Probleme
rien ne s'affiche, quand je laisse une seule image sans le parametrage ca marche si je la parametre ca ne marche pas c'est pariel pour les deux autres.


J'espere que jai bien expliqué mon probleme, merci d'avance [/b]

[Nesmontou]

Salut, pour l'instant impossible de mettre 3 images en background avec le css, mais ça ne devrait plus tarder avec css3 : http://www.w3.org/TR/2005/WD-css3-ba...ckground-image

Pour l'instant, tu peux mettre tes images dans des div que tu positionnes comme tu veux et tu joues avec les z-index

Bon développement ;-)

[nocy]

Merci de votre message,
c'est des informations que j'ignorais, c'est normalement chui encore débutant, et c'est ma premiere fois ici, merci pour l'information.

en passant, voici en [html]
le tableau que je veuxréalisé, peut etre qu'il y en a d'autre façon d'ecrire ca en [css].

<table width="250" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="250" height="8" style="background-image:url(images/top.gif);background-repeat:repeat-x;"></td>
</tr>
<tr>
<td width="250" style="background-image:url(images/bgtb.gif); background-repeat:repeat-y; width:250px;">a href="#">liens 1</a><br />
<a href="#">liens 2 </a></td>
</tr>
<tr>
<td width="250" height="8" style="background-image:url(images/bottom.gif);background-repeat:repeat-x;"></td>
</tr>
</table>

merci

[ghostdogpr]

Comme ca : :

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
#top {
background-image:url(images/top.gif) no-repeat;
width:250px;
height:8px;
} 
 
#center {
background-image:url(images/bgtb.gif) no-repeat;
width:250px;
} 
 
#bottom {
background-image:url(images/bottom.gif) no-repeat;
width:250px;
height:8px;
}

Code :

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

1
2
3
4
5
6
7
8
<div id="top"></div>
 
<div id="center">
  <a href="#">lien 1</a><br />
  <a href="#">lien 2 </a>
</div>
 
<div id="bottom"></div>

[nocy]

merci pour votre réponce, cest ske je voulais faire

mais j'ai du apporter quelque modifications les voici :

#top {
background-image:url(images/top.gif);
background-repeat:no-repeat;
width:250px;
height:8px;
}
#center {
background-image:url(images/bgtb.gif);
background-repeat:repeat-y;
text-align:center;
width:250px;
}

#bottom {
background-image:url(images/bottom.gif);
background-repeat:no-repeat;
width:250px;
height:8px;
}

je ne sais pas pourquoi quand je fait : background-image:url(images/top.gif) no-repeat; no-repeat dans la meme ligne que background ca n'affiche rien (page blanche) es-que c'est du au browser IE et FireFox ou a mon editeur Dreamweaver 8 fr ??