Webmaster Hub: Onglets "écartés" avec IE7. OK avec Firefox & Safari - Webmaster Hub

Aller au contenu

Page 1 sur 1
  • Vous ne pouvez pas commencer un sujet
  • Vous ne pouvez pas répondre à ce sujet

Onglets "écartés" avec IE7. OK avec Firefox & Safari Utilisation de "float:left", <ul>, <li>... Noter : -----

#1 L'utilisateur est hors-ligne   Circobaz 

  • Groupe : Membre
  • Messages : 6
  • Inscrit(e) : 22-février 08
  • Genre:Femme

Posté 22 mars 2008 - 03:31

Bonjour,

Les onglets de ma page "s'écartent" sur IE7, alors qu'ils ne posent pas de problêmes sur Firefox ou Safari.
Si qqn pouvait m'indiquer mon erreur, j'en serais très reconnaissante.
Voilà une des pages en question :

http://www.kalessan.com/KohSamui.html

Les codes de la page CSS correspondant sont :

#tabs {float:left; line-height:normal; border-bottom:#333333 2px ridge; margin-bottom:10px; font-size:13px;}
#tabs ul { margin:0; padding:10px 0 0 0; list-style:none;}
#tabs li { width: auto; float:left; margin:0; padding:0 0 0 7px; position:relative; white-space:pre;
background:url(../../SAMUI/0-Images/Images-Annexe/Left.jpg) no-repeat left 0px;}
#tabs a, #tabs strong { float:left; display:block; padding:4px 50px 4px 10px; text-decoration:none; color:#FFF; font-weight:bold;
/* width:.1em; */
background:url(../../SAMUI/0-Images/Images-Annexe/Onglets.png) no-repeat right 0px;}
#tabs > ul a, #tabs > ul strong {width:auto;}
#tabs a:hover {color:#FFF; text-decoration:underline;}
#tabs #current {background-position: left -100px; border-width:0; color:#fff; z-index: 100;}
#tabs #current strong {background-position: right -100px; padding-bottom:3px; color:#fff; font-size:14px;}
#tabs #currentlast {background-position: left -200px; border-width:0; color:#fff; z-index: 100;}
#tabs #currentlast strong {background-position: right -200px; padding-bottom:3px; color:#fff; font-size:14px;}
#tabs ul li { position: relative;}
#tabs ul li.tab0 {z-index: 20; left: 0;}
#tabs ul li.tab1 {z-index: 19; left: -8px;}
#tabs ul li.tab2 {z-index: 18; left: -16px;}

Les codes de la page web :

<div id="Contour-ONGLETS">
<div id="tabs">
<ul>
<li class="tab0"><a href="SAMUI/Property/Camellia-Pictures.html">Pictures</a></li>
<li id="current" class="tab1"><strong>Plans</strong></li>
<li class="tab2"><a href="SAMUI/Property/Camellia-Location.html">Location</a></li>
</ul>
</div>
</div>


Merci d'avance pour votre aide,

Circobaz,
0

#2 L'utilisateur est hors-ligne   Circobaz 

  • Groupe : Membre
  • Messages : 6
  • Inscrit(e) : 22-février 08
  • Genre:Femme

Posté 22 mars 2008 - 04:41

J'ai trouvé :) :)

C'était le "white-space:pre;" qui faisait clocher IE7...
Il me semblait que "white-space:pre;" était pour qu'un lien en deux mots ne soit pas coupé en deux. Y'a t'il donc autre chose dans ce code?

Circobaz,
0

Partager ce sujet :


Page 1 sur 1
  • Vous ne pouvez pas commencer un sujet
  • Vous ne pouvez pas répondre à ce sujet

1 utilisateur(s) en train de lire ce sujet
0 membre(s), 1 invité(s), 0 utilisateur(s) anonyme(s)