[CSS] utilisation de display:table
Bonjour,
J'essaie de faire une mise en page d'une barre de navigation simple (<- titre ->) pour faire défiler des photos, en utilisant display:table.
Voici le code :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
| CSS :
#navphoto {
display: table;
border: 1px solid green;
width: 400px;
}
#Fmoins, #Fplus {
display: table-cell;
cursor: pointer;
border: 1px dotted red;
width: 20%;
text-align: center;
}
#texte {
display: table-cell;
cursor: pointer;
text-align: center;
}
HTML :
<div id="navphoto">
<div id="Fmoins"><img src="fleche-gauche.gif" alt="Photo précédente" title="Photo précédente" onclick="PhotoMove(-1);" width="17" height="17" border="0" align="absmiddle"></div>
<strong id="texte">Autres photos</strong>
<div id="Fplus"><img src="fleche-droite.gif" alt="Photo suivante" title="Photo suivante" onclick="PhotoMove(1);" width="17" height="17" border="0" align="absmiddle"></div>
</div> |
L'affichage est bon sous FF : les cellules sont bien les unes à coté des autres.
Sous IE par contre, les cellules sont les unes au dessus des autres 8O
C'est la première fois que j'utilise cette technique, alors j'ai peut-être oublié quelque chose.
Merci[/img]
