Tableau coulissant différent sous Internet explorer et Firefox

2 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Tableau coulissant différent sous Internet explorer et Firefox

Message par SoraNoHime Dim 30 Jan 2011 - 13:34

Bonjour, maintenant que j'ai finis de régler mon tableau en taille Voir le sujet

Je passe ici pour régler un autre problème.

En effet sous IE, le tableau donne ceci.

Tableau coulissant différent sous Internet explorer et Firefox 211

et sous fox ceci

Tableau coulissant différent sous Internet explorer et Firefox 311

Je précise que ma résolution d'écran est de 1024 x 768, et celle de ma co admin qui vois la meme chose sous fox est de 1024 x 800.

J'ai entouré en vert ce qui ne va pas.

Voici ma css :

Code:
/*Tableau dynamique*/
.tabbed_content {
  WIDTH: 760px
}
.tabs {
  background-color: #6f1716;
                POSITION: relative;
  HEIGHT: 62px
}
.tabs .moving_bg {
  BACKGROUND-IMAGE: url(http://i38.servimg.com/u/f38/14/98/49/11/onglet10.gif);
  POSITION: absolute;
  PADDING-BOTTOM: 29px;
  BACKGROUND-COLOR: #6f1716;
  PADDING-LEFT: 10px;
  WIDTH: 113px;
  PADDING-RIGHT: 10px;
  BACKGROUND-REPEAT: no-repeat;
  BACKGROUND-POSITION: center bottom;
  PADDING-TOP: 15px;
  LEFT: 0px
}
.tabs .tab_item {
  POSITION: relative;
  TEXT-ALIGN: center;
  PADDING-BOTTOM: 15px;
  PADDING-LEFT: 10px;
  WIDTH: 106px;
  PADDING-RIGHT: 10px;
  DISPLAY: block;
  FLOAT: left;
  PADDING-TOP: 15px
}
.tabbed_content .slide_content {
  POSITION: relative;
  PADDING-BOTTOM: 20px;
  WIDTH: 730px;
  OVERFLOW: hidden;
  PADDING-TOP: 7px
}
.tabslider {
  WIDTH: 4560px
}
.tabslider UL {
  PADDING-BOTTOM: 0px;
  MARGIN: 0px 20px 0px 0px;
  PADDING-LEFT: 0px;
  WIDTH: 720px;
  PADDING-RIGHT: 0px;
  FLOAT: left;
  PADDING-TOP: 0px
}
.encadre1 {
  TEXT-ALIGN: center;
  FONT-FAMILY: Amazone BT;
  COLOR: #000000;
  FONT-SIZE: 11px;
  BACKGROUND-COLOR: #f5dcdc;
  LINE-HEIGHT: 12px;
  DISPLAY: block;
  FLOAT: center;
  LETTER-SPACING: 0px;
                padding:0 10px;
  border:2px solid #6f1716;
}
.encadre2 {
  TEXT-ALIGN: center;
  FONT-FAMILY: Amazone BT;
  COLOR: #000000;
  FONT-SIZE: 14px;
  BACKGROUND-COLOR: #f5dcdc;
  LINE-HEIGHT: 12px;
  DISPLAY: block;
  FLOAT: center;
  LETTER-SPACING: 0px;
                padding:0 10px;
  border:4px solid #6f1716;
}
hr.td {
COLOR: #6f1716;
background-color: #6f1716;
height: 1px;
border: 0;
}

mon tableau dans Affichage > Généralités :

Code:
<DIV class="tabbed_content"><DIV class="tabs"><DIV class="moving_bg"></DIV>
<SPAN class="tab_item"><img src="http://i35.servimg.com/u/f35/15/15/64/77/minixa10.jpg" width="100" height="36" border="0" alt="Image hébergée par servimg.com" /></SPAN>
<SPAN class="tab_item"><img src="http://i65.servimg.com/u/f65/12/35/71/06/minifa10.jpg" width="100" height="36" border="0" alt="Fanasia Paradise"/></SPAN>
<SPAN class="tab_item"><img src="http://i35.servimg.com/u/f35/14/85/06/89/minifa11.jpg" width="100" height="36" border="0" alt="Fanasia paradise forum" /></SPAN>
<SPAN class="tab_item"><img src="http://i35.servimg.com/u/f35/14/85/06/89/minidr10.jpg" width="100" height="36" border="0" alt="Drama Lovers"/></SPAN>
<SPAN class="tab_item"><img src="http://i65.servimg.com/u/f65/14/85/06/89/minima10.jpg" width="100" height="36" border="0" alt="Manga Lovers"/></SPAN>
<SPAN class="tab_item"><img src="http://i33.servimg.com/u/f33/15/43/05/04/minifa10.jpg" width="100" height="36" border="0" alt="Fanasia creations" /></SPAN>
</DIV><DIV class="slide_content"><DIV class="tabslider">
<UL><DIV><center><b>Bienvenue sur le Ring Fanasia Paradise : XAT commune à tous les forums</b></center>
<TABLE BORDER class="forumline"><TR><TD>
<center>XAT</center>
</TD></TR></TABLE></DIV></UL>
<UL><center><b>Retrouvez toute l'actualité du Ring Fanasia Parasise en cliquant sur le logo Fanasia Paradise ou sur Facebook</b><br/><br/></center>
<table width="100%"><tr height="90"><td align="center" valign="middle" width="45%">             
FACEBOOK J'aime<br/><br/>
<table width="100%"><tr><td valign="middle" align="center" width="50%">
<img src="http://i25.servimg.com/u/f25/14/85/06/89/minifa10.jpg" border="0" alt="Fanasia Paradise Kado kado" /><br/>Clan du Ring sur Kado Kado
</td><td valign="middle" align="center" width="50%">
<img src="http://i65.servimg.com/u/f65/12/35/71/06/minifa10.jpg" border="0" alt="Fanasia Paradise"/><br/>Le Site Fanasia Paradise
</td></tr></table>
</td><td valign="top" align="center" width="50%" height="150">
<img src="http://i35.servimg.com/u/f35/14/85/06/89/minico10.gif" border="0" alt="Image hébergée par servimg.com" /><br/>Livre d'or du Ring Fanasia<br/><br/>
<table width="100%" height="100%" class="encadre1"><tr><td valign="top" width="100%">

<center><br/><b><font size="2">L'Edito de Fanasia</font></b></center><hr class="td">
Texte de l'édito

<br/></td></tr></table></td><td rowspan="3" width="5%"></td></tr></table></UL>
<UL><center><img src="http://i35.servimg.com/u/f35/14/85/06/89/minifa11.jpg" border="0" alt="Fanasia paradise forum" /><br/>Actualités de Fanasia Paradise : Forum sur les pays d'Asie et leurs cultures.</center><br/>
<table width="100%"><tr><td rowspan="3" width="45%" border="1" align="left" valign="top"><img src="http://i63.servimg.com/u/f63/15/43/05/04/fp_hiv10.jpg" border="0" alt="Fanasia Paradise" /></td><td width="25%" border="1" valign="top" class="encadre1">

<br/><b><font size="2">Japon</font></b><hr class="td">
- Sujets du Japon<br/>

</td><td width="25%" border="1" valign="top" class="encadre1">

</br><b><font size="2">Thaïlande</font></b><hr class="td">
- Sujets de la Thailande<br/>

</td><td rowspan="3" width="5%"></td></tr></table></UL>
<UL><center><img src="http://i35.servimg.com/u/f35/14/85/06/89/minidr10.jpg" border="0" alt="Drama Lovers"/><br/>
Actualités de Drama Lovers : Forum sur les drama, les films et la musique asiatiques</center><br/><br/><center><table width="100%"><tr>
<td width="45%" border="1" align="left" valign="top"><img src="http://i33.servimg.com/u/f33/15/43/05/04/dlnouv10.jpg" border="0" alt="Drama Lovers" /></td>
<td width="50%" border="1" valign="top"><center><table width="100%" cellspacing="20"><tr><td width="50%" border="1" align="center" valign="middle" class="encadre2">

Sujet 1

</td><td width="50%" border="1" align="center" valign="middle" class="encadre2">

Sujet 2

</td></tr></table><table width="50%" cellspacing="20"><tr><td width="50%" border="1" align="center" valign="middle" class="encadre2">

Sujet 3

</td></tr></table></center></td><td width="5%"></td></tr></table></center></UL>
<UL><center><img src="http://i65.servimg.com/u/f65/14/85/06/89/minima10.jpg" border="0" alt="Manga Lovers"/><br/>
Actualités de Manga Lovers : Forum sur les mangas et les animés.</center><br/><br/><center><table width="100%"><tr>
<td width="45%" border="1" align="left" valign="top"><img src="http://i65.servimg.com/u/f65/14/85/06/89/mlnorm10.jpg" border="0" alt="Image hébergée par servimg.com" /></td>
<td width="50%" border="1" valign="top"><center><table width="100%" cellspacing="20"><tr><td width="50%" border="1" align="center" valign="middle" class="encadre2">

Sujet 1

</td><td width="50%" border="1" align="center" valign="middle" class="encadre2">

Sujet 2

</td></tr><tr><td width="50%" border="1" align="center" valign="middle" class="encadre2">

Sujet 3

</td><td width="50%" border="1" align="center" valign="middle" class="encadre2">

Sujet 4

</td></tr></table></center></td><td width="5%"></td></tr></table></center></UL>
     
<UL><center><img src="http://i33.servimg.com/u/f33/15/43/05/04/minifa10.jpg" border="0" alt="Fanasia creations" /><br/>
Actualités de Fanasia Creations : Pour toutes les créations de fans à travers le monde.</center><br/><table width="100%"><tr>
<td width="45%" border="1" align="left" valign="top"><img src="http://i63.servimg.com/u/f63/15/43/05/04/fc_hiv10.jpg" border="0" alt="Fanasia créations" /><br/><br/></td><td width="50%" valign="top" class="encadre1">

<br/><b><font size="2">Fanfics</font></b> : <hr class="td">
- Liste fanfics

<br/></td><td rowspan="2" width="5%"></td></tr><tr><td width="45%" valign=top class="encadre1">

<br/><b><font size="2">Vidéos</font></b> : <hr class="td">
- Liste vidéo

<br/></td><td width="50%" valign="top" class="encadre1">

<br/><b><font size="2">Créations graphiques</font></b> : <hr class="td">
<table width="100%"><tr><td>
- Liste 1
<br/></td><td>
- Liste 2
<br/></td><td>
- Liste 3

<br/></td></tr></table></td></tr></table></UL></DIV></DIV></DIV>

J'ai aussi un code dans un template qui renvoie au javascript pour faire coulisser le tableau. (mais inutile ici puisque le tableau fonctionne bien)

En fait c'est l'apparence dans les catégories qui foire cette fois (ceux qui sont encadrés en vert)

Quelqu'un peut-il m'aider ?

Ps : ge80, tu m'as dit que sous fox tu ne voyais pas le problème, si ce n'est pas indiscret peux-tu me dire en quel version de fox tu es ?

Cordialement.
SoraNoHime

SoraNoHime
Membre actif

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

SoraNoHime a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Tableau coulissant différent sous Internet explorer et Firefox

Message par ge80 Dim 30 Jan 2011 - 14:32

En mettant des bordures sur vos tableaux vous verrez de gros problèmes de positionnement et de largeur Wink

En enlevant la classe au dernier tableau, on change le positionnement du dernier tableau sous firefox.

Code:
<td width="40%" valign="top" class="encadre1">    <br/><b><font size="2">Créations graphiques</font></b> : <hr class="td"><div>

Code:
<td width="40%" valign="top">    <br/><b><font size="2">Créations graphiques</font></b> : <hr class="td"><div>
ge80

ge80
Membre actif

Masculin
Messages : 16167
Inscrit(e) le : 08/10/2006

http://www.tsi80.net/
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Tableau coulissant différent sous Internet explorer et Firefox

Message par SoraNoHime Lun 31 Jan 2011 - 11:36

J'ai enlevé tous mes style appliqués au tableau, donc "encadre1", "encadre2". Et en effet, les cellules se mettent enfin à leur place sous fox.

Mais dans ce cas comment appliqué un style à mes encadrements de cellules choisies sans que celà ne déforme mon tableau sous fox ? dois-je tout copier en version html plutot que passer par une feuille de style (mon dieu j'ai l'impression de revenir à l'age des cavernes où l'on tapait x fois la même chose pour dire que chaque alignement, cellule, couleur de texte était égale à ça dans chaque cellule ^^ vive le copier coller si c'est ça)
SoraNoHime

SoraNoHime
Membre actif

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

SoraNoHime a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Tableau coulissant différent sous Internet explorer et Firefox

Message par ge80 Lun 31 Jan 2011 - 11:44

Non, mais maintenant, il faut réfléchir à ce qui fait "boguer" FF et non pas IE ( IE ne respecte pas les normes Wink )
La CSS est la cause donc modifier progressivement les propriétés pour voir celles qui provoquent le passage à la ligne !

Je n'ai pas le temps aujourd'hui mais je ne lâche pas l'affaire Wink
ge80

ge80
Membre actif

Masculin
Messages : 16167
Inscrit(e) le : 08/10/2006

http://www.tsi80.net/
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Tableau coulissant différent sous Internet explorer et Firefox

Message par SoraNoHime Lun 31 Jan 2011 - 12:41

Merci ge80, j'ai trouvé c'est le
Code:
DISPLAY: block;
qui gachait tout

maintenant le tableau est parfait. Problème résolu.
SoraNoHime

SoraNoHime
Membre actif

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

SoraNoHime a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Tableau coulissant différent sous Internet explorer et Firefox

Message par ge80 Lun 31 Jan 2011 - 12:55

Bien entendu Wink

Bonne journée
ge
victoire
ge80

ge80
Membre actif

Masculin
Messages : 16167
Inscrit(e) le : 08/10/2006

http://www.tsi80.net/
ge80 a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum