[Résolu] Affichage problématique sous IE

[DS.65]

Bonjour à tous et à toutes,

Je viens vers vous car après avoir créer un petit commerce, je lui ai dédier un petit espace sur le toile:

Accueil

mon problème est la différence d'affichage entre FireFox 3.6.8 et Internet Explorer 8 au niveau du menu "Navigation" sur la droite.

Je travaille avec dreamweavaer cs5 et me demandai si il n'y avais pas un solution simple et rapide à mettre en place pour remédier à ce problème, sachant que je n'y connais que peu de chose dans le code html.

 

Merci à tous

[Dylav]

Bonsoir DS.65,

 

Tout d'abord, on ne peut hélas pas espérer que le rendu d'une page HTML soit exactement le même sur tous les navigateurs, dans la mesure où ils ne se conforment pas de la même façon aux recommandations du W3C.

 

En ce qui concerne ta page, on constate effectivement une grosse différence dans l'apparence du petit menu de droite. Sous FF, les lignes de ce menu se suivent naturellement. Sous IE, elles se répartissent sur toute la hauteur du corps de texte situé à gauche. C'est très certainement dû au fait que l'ensemble de cette page est un gigantesque tableau aux imbrications multiples, dont le menu de droite occupe 8 lignes (titre, 6 choix, barre de clôture) aux hauteurs imposées. FF est futé, en ignorant la hauteur imposée de la 8ème ligne et en tassant tout vers le haut. IE en revanche répartit proportionnellement toutes les lignes sur la hauteur imposée par le corps de texte de gauche.

 

Solution : ne pas spécifier la hauteur de la 8ème ligne (barre de clôture). Cela se situe vers la ligne 170 du fichier HTML.

 

<tr>

<td height="24" colspan="2" bgcolor="#FFFFCC" id="menu_7" style="text-align: center">...</td>

<td><img src="images/spacer.gif" width="1" height="24" alt="" /></td>

</tr>

<tr>

<td colspan="2" valign="top" bgcolor="#FFFFCC" id="Tableau_01">

<img src="images/menu_X.png" width="212" height="8" /></td>

<td><img src="images/spacer.gif" width="1" height="41" alt="" /></td>

</tr>

Une petite remarque : ta page est juste un poil trop large pour les résolutions 1024x768. Pour faire disparaître la barre de scrolling horizontal (présence désagréable et pas esthétique), il suffit que tu précises que tu imposes des marges nulles au corps de la page. Cela se situe vers la ligne 10 du fichier HTML.

 

<style type="text/css">

body {margin:0;

background-image: url(images/fond.png);

}

Pour finir, je ne peux que déplorer cette structuration de page par le biais de tableaux. Cela détourne l'usage du concept de tableau, rendant incompréhensible la description qui en sera faite aux handicapés visuels par un dispositif audio spécialisé. Eux aussi aimeraient peut-être connaître ton restaurant... c'est dommage.

 

Ce n'est pas à l'honneur d'un générateur de pages comme DreamWeaver

 

P.S.: je t'envoie un MP pour d'autres remarques qui ne relèvent pas de la programmation

[DS.65]

Merci à toi

 

je ne peux que déplorer cette structuration de page par le biais de tableaux. Cela détourne l'usage du concept de tableau, rendant incompréhensible la description qui en sera faite aux handicapés visuels par un dispositif audio spécialisé. Eux aussi aimeraient peut-être connaître ton restaurant... c'est dommage.

C'est regrettable, mais je n'ai pas les compétences pour y remédier.

 

 

P.S.: je t'envoie un MP pour d'autres remarques qui ne relèvent pas de la programmation

 

C'est très important, c'est bien plus sérieux après un petite correction.

 

Merci encore

[Dylav]

Le problème semble avoir trouvé sa solution.

Ainsi, afin de signaler clairement à ceux qui ont un problème similaire qu'ils ont peut-être une solution toute trouvée (s'ils pensent à utiliser la fonction Recherche en indiquant le mot-clé "résolu" auparavant), et afin de signaler aux autres contributeurs qu'il est inutile de continuer à se creuser la tête sur le problème (à moins d'avoir des suppléments d'informations à apporter pour mieux comprendre ce qui posait problème), un modérateur a préfixé le titre du topic avec la mention [résolu].

Merci, à l'avenir, de bien vouloir prendre à votre charge cette mise à jour quand vous estimez que votre problème a été résolu de manière satisfaisante (et parallèlement, si le problème a disparu "mystérieusement", inutile d'induire les gens en erreur ). Pour cela, votre premier message