Discussion :

[liliprog]

J'ai developpé mon site pour qu'il soit optimisé sous IE. Je me suis interessé maintenant à la visualisation de ce meme site sous firefox et là surprise.

Principal soucis c'est l'affichage de l'image d'arriere plan qui n'est plus bien dimensionné.
Voici ma feuille de style:

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
 
.lebloccontenu {
background-image: url('./images/Bodyc.jpg');
background-repeat:no-repeat;
background-attachment:fixed;
width: 100%;
height: 100%;
}
.leblocmenu
{
background-image: url('./images/Menuc.jpg');
background-repeat:no-repeat;
background-attachment:fixed;
width: 100%;
height: 100%;
}

Sous IE, les images d'arriere plan remplissent bien leur colonne mais sous firefox, l'image garde sa taille original

Voilà en résumé le code html utilisant le css:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<table style="HEIGHT: 80%" align="center" border="0" cellSpacing="0" cellPadding="0" width="760">
 <TBODY>
   <tr>
     <TD vAlign="top" width="74" style="WIDTH: 60px">
     <div class="leblocmenu">
     <aspfd:menu id="Menu1" runat="server"></aspfd:menu>
     <TD>
     <div class="lebloccontenu">......</div>
     </td>
   </tr>
  </TBODY>
</table>

Y a t il des attributs qui ne sont pris en compte par firefox? ou bien y a t il des erreurs dans ma css ou mon code html?

Je viens de me rendre compte que ça en change rien que je mette ou pas les attributs width et height dans la feuille de style!!

[XristofGreek]

dans ta feuille de style tu mets

Code :

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

1
2
3
background-image: url('./images/Bodyc.jpg'); 
width: 100%; 
height: 100%;

J'imagine que ce que tu voulais c'est que l'image s'agrandissent à 100% dans la largeur et hauteur du div mais malheureusement çà marche pas comme çà. le background-image ecrit l'image à sa taille et ne fait pas d'agrandissement. pour çà il faut utiliser le tag html <img> pour lequel tu peux spécifier une hauteur et largeur.

ensuite tu ecris dans ton code HTML :

Code :

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

<TD vAlign="top" width="74" style="WIDTH: 60px">

soit 2 fois la propriété width ! je pense que IE et Firefox ne réagissent pas de la même façon à cette erreur et c'est pour çà que tu as une différence entre les deux navigateurs.

[liliprog]

ok merci mais je mettais apreçu un peu après avoir posté le message que les attributs width et height ne servaient pas à grand chose dans mon cas. Donc le probleme d'affichage de mes images ne vient pas de là. D'où je ne sais pas???