Aller au contenu

CSS bug sur Firefox (pas sous IE)


Ajna

Sujets conseillés

Salut, j'ai mis un menu sur mon site à gauche de la page celui ci sous IE s'affiche correctement sous firefox on dirait qu'il interprette autrement mon code CSS. J'ai pu me trompé je débute le CSS..

le menu de gauche est constité de boutons dynamiques sous firefox ils s'entre chevauchent et ils ne prennent pas la longeur que dit le css, je ne vois pas pourquoi, pouvez vous m'aider.

extrait du CSS

.menu_bouton{
text-align:center;padding:5px;}

a.menu_bouton:link{
width:147px;
height:30px;
text-decoration:none;
color:#FF2000;
text-align:center;
font-weight:bold;
background-color:#FFAF66;
padding:5px;
border-style:outset;
border-width:none;
border-color:orange;
}

a.menu_bouton:visited{
width:147px;
height:30px;
text-decoration:none;
color:#FF6500;
text-align:center;
font-weight:bold;
background-color:#FFDF93;
padding:5px;
border-style:outset;
border-width:none;
border-color:orange;
}

a.menu_bouton:hover{
width:147px;
height:30px;
text-decoration:none;
color:#FF1500;
text-align:center;
font-weight:bold;
background-color:#FF6E3E;
background-image:none;
padding:5px;
border-style:inset;
border-width:none;
border-color:orange;
}

Extrait du html

<table width="1px" border="0" align="left" cellpadding="0" cellspacing="0">
<tr><td width="400">     
        
       </td>
<td><table  width="780" border="0" align="left"
     cellpadding="0" cellspacing="0">
 <tr>
   <td height="150"><img src="http://membres.lycos.fr/reikisource/images/header.jpg"
 width="780" height="150"
alt="reiki soins domicile Rhône (Lyon,Villefranche,Losanne,...)">
</td>
 </tr>
 <tr>
   <td align="center" class="menu_haut" height="34"
    background="images/menuhaut.jpg">
   <script LANGUAGE="JavaScript" type="text/javascript"
    SRC="ejs_menu_dyn.js"></SCRIPT></td>
 </tr>
 <tr>
   <td height="84" background="images/haut.jpg"></td>
 </tr>
 <tr>
   <td><table width="780" border="0" cellspacing="0" cellpadding="0">
       <tr>
         <td width="180" valign="top" background="images/fond.jpg">
  <p><img src="images/image.jpg" width="180" height="88">
           <table width="180" height="200" border="0" align="center"
       cellpadding="0" cellspacing="0" >
             <tr>
               <td height="10px" ><table class="menu_gauche" width="10px"
      border="0" align="center" cellpadding="0" cellspacing="0">
                   <tr>
                     <td width="18"> </td>
                     <td width="112"><strong><a href="reiki.php"
      class="menu_bouton">LE REÏKI</a></strong></td>
                     <td width="14"> </td>
                   </tr>
                   <tr>
                     <td> </td>
                     <td><strong><a href="soins.php"
       class="menu_bouton">SOINS</a></strong></td>
                     <td> </td>
                   </tr>
                   <tr>
                     <td> </td>
                     <td><strong><a href="consultations.php"
        class="menu_bouton">CONSULTATIONS</a></strong></td>
                     <td> </td>
                   </tr>
      <tr>
                     <td> </td>
                     <td><strong><a href="ethique.php"
    class="menu_bouton">ÉTHIQUE</a></strong></td>
                     <td> </td>
                   </tr>
                   <tr>
                     <td> </td>
                     <td><strong><a href="energetique.php"      
           class="menu_bouton">ÉNERGÉTIQUE</a></strong></td>
                     <td> </td>
                   </tr>
                   <tr>
                     <td> </td>
                     <td><strong><a href="meditation.php"
             class="menu_bouton">MÉDITATION</a></strong></td>
                     <td> </td>
                   </tr>
     <tr>
                     <td> </td>
                     <td><strong><a href="mailto:soins_AT_reiki-soins.com"      
             class="menu_bouton">CONTACT</a></strong></td>
                     <td> </td>
                   </tr>
                   <tr>
                     <td> </td>
                     <td><strong><a href="liens.php" class="menu_bouton">
               LIENS</a></strong></td>
                     <td> </td>
                   </tr>
                 </table></td>
             </tr>
           </table></td>

Lien vers le commentaire
Partager sur d’autres sites

Je penses qu'il faudrait voir a supprimer certains tableaux imbriqués, perso je trouve le code imbuvable.

A la place d'utiliser un tableau autours de ton menu, tu pourrais utiliser une liste <ul><li>...</li><li>...</li></ul>

Lien vers le commentaire
Partager sur d’autres sites

Un code (css ou html) ne doit pas etre fait pour IE :nono:

Il ne doit pas non plus être fait pour Firefox non plus, ni pour Opera, ni pour Safari, ni pour qui que ce soit ! :huh:

J'ai un peu l'impression que c'est ce que tu sous-entends :unsure:

Lien vers le commentaire
Partager sur d’autres sites

oui petit-ourson, je simplifiera l'utilisation des tableaux.

J'ai fais d'autres tests, effectivement il sagit des standards css qui ne sont pas reconnu de la même façon suivant les navigateurs, dans ce cas comment l'on fait normalement? utiliser des fonction pour différencier les navigateurs des visiteurs puis en fonction de cela utiliser des feuilles de styles différentes? :wacko:

Lien vers le commentaire
Partager sur d’autres sites

Salut, j'ai mis un menu sur mon site à gauche de la page celui ci sous IE s'affiche correctement sous firefox on dirait qu'il interprette autrement mon code CSS.

Salut ;)

Malheureusement, ce n'est pas la bonne démarche :-/

IE est actuellement le navigateur le plus buggué et le plus permissif en ce qui concerne les standards et les CSS. Il ne faut donc pas s'y fier.

Il faut avant tout faire un document conforme aux standards pour être sûr de fonctionner sur les navigateurs les plus scrupuleux (Firefox, Opera), et IE suivra aussi.

Voici une méthodologie :

http://blog.alsacreations.com/2004/11/27/9...les-navigateurs

Lien vers le commentaire
Partager sur d’autres sites

Je ne vois pas trop l'interet des tableaux dans ce suite. Les blocs <div> feraient aussi bien l'affaire avec du code plus lisible mais bon chacun ses choix  ;)

<{POST_SNAPBACK}>

Salut,

Mieux vaut commencer avec la bonne méthode, que de devoir s'adapter (peut-être difficilement) par la suite parce qu'on est parti sur une mauvaise voie.

Je te conseille d'abandonner tout de suite la mise en page par tableaux, tu te rendras un fier service. Tu verras, tu te remercieras plus tard. ;)

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...