1 Sujet de binary Dernière modification par binary (30-01-2009 04:33:53)

  • binary
  • binary
  • Equipe lesCigales.ORG
  • Déconnecté
  • De : Québec, Canada
  • Inscrit : 10-12-2008
  • Messages : 72

Sujet : Problème d'affichage dans Iexplorer

Bonsoir j'ai une colle pour les experts en HTML-CSS.

Il se trouve que l'affichage des TABULATIONS sur le template dans lequel je travaille présentement est annormal sur Internet Exploreur tandis que sur Firefox tout s'affiche correctement.

/*Le CODE HTML*/

<link href="text-tag.css" rel="stylesheet" type="text/css">
<link href="styles.css" rel="stylesheet" type="text/css">

<div id="header-tab">
  <div id="tab">
    <ul>
        <li><a href="" title="Accueil">Accueil</a></li>
        <li><a href="" title="Qui je suis?">Qui je suis?</a></li>
        <li><a href="" title="">Services</a></li>
    </ul>
  </div>
</div>

/*LE CODE CSS*/

div#header-tab{
margin-top:-20px;
float:right;
width:430px;
}

#tab {
float:left;
font-size:93%;
line-height:31px;
background:#DAE0D2 url("img/bg.png")repeat-x bottom;
}
#tab ul {
    margin:0;
    padding:0;
    list-style:none;
    }
  #tab li {
    float:left;
    background:url("img/left.png") no-repeat left top;
    margin:0;
    padding:0 0 0 9px;
    }
  #tab a, #tab strong, #tab span {
    display:block;
    background:url("img/right.png") no-repeat right top;
    padding:5px 15px 4px 6px;
    }

  /* Commented Backslash Hack
     hides rule from IE5-Mac \*/
  #tab a {float:none;}
  /* End IE5-Mac hack */

/*FIN DU CODE*/

Voici le lien du Template: http://binarysim.lescigales.org/Lime/

L'exemple de la Sliding Doors Technique, litérallement un copy paste du tutoriel ne fonctionne pas sous IE

Voici le lien de l'article: http://www.alistapart.com/articles/slidingdoors

Citer Message 1

2 Réponse de binary

  • binary
  • binary
  • Equipe lesCigales.ORG
  • Déconnecté
  • De : Québec, Canada
  • Inscrit : 10-12-2008
  • Messages : 72

Re: Problème d'affichage dans Iexplorer

Est-ce que quelqu'un aurait une idée du CSS Hack que je dois utiliser pour que le menu en tabulations s'affiche correctement dans IE 6?

Citer Message 2

  • Inscrit : 22-05-2009
  • Messages : 3

Re: Problème d'affichage dans Iexplorer

Très sincèrement, je comprends que tu veuilles corriger des erreurs d'affichage pour une compatibilité cross navigateur, mais d'après les stats de mes sites Internet avant mes scripts pour les bloquer, j'avais 0% des visiteurs qui possèdait ce navigateur.
Il commence tout de même à être dépassé.

D'ailleurs quand je tiens compte des utilisateurs de IE6, je suis radical, je bloque l'affichage de mes sites, et j'envoie un message d'alerte signalant que le navigateur est dangereux pour la navigation du visiteur tongue

Certes c'est pas le meilleur moyen de se faire des visiteurs, mais compte tenu de la prise en charge "technologique" de IE6, je préfère me passer de ces visiteurs wink

Désolé, je ne suis pas de très bon conseil... mais même utiliser un hack n'est pas très pratique, le jour où le bug est corrigé sur le moteur du navigateur, tu fais quoi ? Tu changes encore une fois de hack ?

Tchuuuusss wink

Citer Message 3

  • Inscrit : 03-02-2009
  • Messages : 681

Re: Problème d'affichage dans Iexplorer

tu ne pourras jamais contenter tout le monde, donc il faut faire des choix.
comme le dit Riku, IE6 est une infime partie des visiteurs, donc perdre 1% de visiteur est vraiment négligeable.

Citer Message 4

  • Inscrit : 04-05-2009
  • Messages : 101

Re: Problème d'affichage dans Iexplorer

Hello,

Le problème ne vient pas de ton code, ni des améliorations que tu pourras y apporter. Malheureusement aucun remède ne peut t'aider pour IE6 qui à un retard technologique important notamment dans le support CSS2.1 et la validité du code.

Ce que tu peux par contre faire est de faire une CSS standard à tous les navigateurs et de corriger dans une autre CSS explicite à IE6.
Tu utiliseras donc les commentaires à structure conditionnelle (type : 

<!--[if IE]>
   <link href="http://site.lescigales.org/css/ie.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
<!--[if lte IE 6]>
    <link href="http://site.lescigales.org/css/ie_lt6.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->

) pour tout corriger...
C'est l'unique méthode.

Personnellement je désactive les CSS pour IE6.

Quant au fait qu'il ne représente qu'un unique pourcent de visite, cela peut être vrai pour les sites destinés aux particuliers, malheureusement en entreprise, il frôle encore les 18%... C'est donc à tenir en compte.

Toutefois ta démarche est excellente, prôner l'avancée technologique, tout en tenant compte d'un maximum de visiteur ; mais là c'est peine perdue... Il faut se résoudre à coder aux standards et à désactiver la CSS si tu tiens "vraiment" à faire comme cela.

Bat,

G.

Citer Message 5