Aller au contenu

CSS bug sur Firefox (pas sous IE)


Sujets conseillés

Posté

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>

Posté

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>

Posté
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:

Posté

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:

Posté
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

Posté

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é

merci pour le lien Sibelius, v4np13 l'interet des tableaux.., c'est que j'avais commencé comme ça dès le debut :unsure: ...

Posté
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. ;)

Veuillez vous connecter pour commenter

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



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