Problème d'affichage d'un tableau

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Problème d'affichage d'un tableau

acorsa

Bonjour,
J'ai un problème mors de l'affichage de mon tableau sous IE alors que sous Firefox tout est nickel.
Voici mon code:

Code :

<div style="width:100%;overflow:auto;">
<table id=mainTable1 cellpadding="0" cellspacing="0" style="width:100%;overflow:hidden;">
<tr>
<?echo "<td id=$th width=33px>Date</td>
<td id=$th width=13px>Lg</td>
<td id=$th width=57px>File</td>
<td id=$th width=57px>Type</td>
<td id=$th width=119px>Source text</td>
<td id=$th width=135px>Proposal</td>
<td id=$th width=133px>Query/Comment</td>
<td id=$th width=\"1%\">Status</td>";?>
</tr>
</table>
</div>
<div style="width:100%; height:210px; overflow-Y:auto;">
<table id=mainTable1 cellpadding="0" cellspacing="0" style="border-collapse: collapse; width:100%; overflow:; ">
<?
while($query51 and $data = mysql_fetch_array($query51)) {
$author=$data["Translator_name"];
$language=$data["language_name"];
$doc_type=$data["Query_type"];
$doc_name=str_replace("\"\"","\"",$data["Doc_name"]);
$query=str_replace("\"\"","\"",$data["Query_text"]);
$reference=str_replace("\"\"","\"",$data["Reference"]);
$proposal=str_replace("\"\"","\"",$data["Proposal"]);
$replied=$data["Replied"];
$date=$data["Creation_date"];
$query_status=$data["Query_status"];
$query_id=$data["query_id"];
$nb=mysql_num_rows($query51);
$query53=mysql_query("select distinct ISO from Languages where language_name='$language'" );
while($query53 and $data = mysql_fetch_array($query53)){
$iso=$data["ISO"];
}
if ($browser=='Firefox'){
$size_date='50px';
$size_lg='28px';
$size_doc='80px';
$size_type='80px';
$size_src='160px';
$size_proposal='180px';
$size_query='180px';
}
else if ($browser=='Internet Explorer'){
$size_date='50';
$size_lg='28';
$size_doc='80';
$size_type='80';
$size_src='160';
$size_proposal='180';
$size_query='180';
}
echo "<tr width=\"100%\">
<td width=$size_date><div class=fix_cell><font size=2>$date</font</div></td>
<td width=$size_lg><div class=fix_cell>$iso</div></td>
<td width=$size_doc><div class=fix_cell>$doc_name</div></td>
<td width=$size_type><div class=fix_cell>$doc_type</div></td>
<td width=$size_src><div class=fix_cell>$reference</div></td>
<td width=$size_proposal><div class=fix_cell>$proposal</div></td>
<td width=$size_query><div class=fix_cell>
<a href=\"popup.php?query_id=$query_id\" onclick=\"return !window.open(this.href,null,'width=610,height=690, status=no, directories=no, toolbar=no, location=no, menubar=no, scrollbars=yes, resizable=yes');\"><font color=\"blue\">$query</font></a>
</div></td>
<td id=td1 width=2% >";
if ($status==1) echo "<img src=\"./../img/new.jpg\" title=\"New query\"></td>";
else if ($status==4) echo "<img src=\"./../img/customer.gif\" width=\"21px\" height=\"30px\" title=\"Sent to customer\"></td>";
else if (($status==3)||($status==5)) echo"<img src=\"./../img/reply.gif\" title=\"Answered\"></td>";
else if ($status==2) echo "<img src=\"./../img/sablier3.jpg\" title=\"Pending\"></td>";
if ($nb<=4) echo "<td width=\"2%\"></td>";
}
?>
</table>
</div>

Je sais c'est un peu compliqué mais c'est pcq que je dois avoir une scrollbar pour le tableau et pour certaines cases si besoin. Le problème ici c'est que les cases prennent un scrollbar si le contenu est trop grand sauf la case "File" qui contient le nom du document et dont le code est:

Code :

<td width=$size_doc><div class=fix_cell>$doc_name</div></td>

En complément je vous mets le code de la css:

Code :

.fix_cell{
height:40px;
overflow-y:auto;
text-align:center;
border-style:solid;
border-width:1px;
border-color:#AF0F01;
}

J'espère que vous connaissez la raison de ce problème car j'y ai déjà perdu beaucoup de temps!!
Merci d'avance

Publicité

dartyduck

n00b AttitudE

déjà, tu oublies php à l'ouverture du php : <?php ... ?>
Ensuite, ton

Code :

.fix_cell{
height:40px;
overflow-y:auto;
text-align:center;
border-style:solid;
border-width:1px;
border-color:#AF0F01;
}

peut etre remplacé par

Code :

.fix_cell{
height:40px;
overflow-y:auto;
text-align:center;
border:1px solid #AF0F01;
}

Message édité par dartyduck le 11-04-2007 à 17:42:32

---------------
Nikon D7000 + 18-105VR + 35mm 1.8

acorsa

Je te remercie mais maleheureusement ça ne résoud pas mon problème...

dartyduck

n00b AttitudE

tu as pas mis de " à ton id de table:

Code :

<table id="mainTable1" cellpadding="0" cellspacing="0" style="border-collapse: collapse; width:100%; overflow:; ">

et utilise ta fauille css pour son style.
Ensuite, ton

Code :

<div style="width:100%; height:210px; overflow-Y:auto;">

n'est pas tres xhtml ! utilise ta feuille css.
tu dois mettre des " à chaque div ou class. Et <div class=""> n'existe pas. c'est <span class=""></span> ou <div id=""></div>
Ensuite, faudrait que je prenne le temps de me plonger dans tes variables et là j'ai pas trop le temps.

---------------
Nikon D7000 + 18-105VR + 35mm 1.8

acorsa

Bon vu que tu as l'air de t'y connaître je te lache pas!! J'ai corrigé mon code selon tes remarques..ms ça marche toujours pas...En fait, toutes mes cases sous IE s'affichent bien avec des scrollbars qd le texte est trop long..toutes..sauf une! j'ai pensé que c'est à cause du texte (c'est un nom de fichier assez long donc il n'y a pas d'espace entre les mots) et dc la césure ne peut pas se faire ms apparement c pas ça...
Je te remets le code:

Code :

<div id="maindiv">
<table id="mainTable1" cellspacing="0" cellpadding="0">
<tr>
<?php
echo "<td id=$th width=33px>Date</td>
<td id=$th width=13px>Lg</td>
<td id=$th width=57px>File</td>
<td id=$th width=57px>Type</td>
<td id=$th width=119px>Source text</td>
<td id=$th width=135px>Proposal</td>
<td id=$th width=133px>Query/Comment</td>
<td id=$th width=\"1%\">Status</td>";?>
</tr>
</table>
</div>
<div id="maindiv">
<table id="mainTable1" cellspacing="0" cellpadding="0">
<?php
while($query51 and $data = mysql_fetch_array($query51)) {
$author=$data["Translator_name"];
$language=$data["language_name"];
$doc_type=$data["Query_type"];
$doc_name=str_replace("\"\"","\"",$data["Doc_name"]);
$query=str_replace("\"\"","\"",$data["Query_text"]);
$reference=str_replace("\"\"","\"",$data["Reference"]);
$proposal=str_replace("\"\"","\"",$data["Proposal"]);
$replied=$data["Replied"];
$date=$data["Creation_date"];
$query_status=$data["Query_status"];
$query_id=$data["query_id"];
$nb=mysql_num_rows($query51);
$query53=mysql_query("select distinct ISO from Languages where language_name='$language'" );
while($query53 and $data = mysql_fetch_array($query53)){
$iso=$data["ISO"];
}
if ($browser=='Firefox'){
$size_date='50px';
$size_lg='28px';
$size_doc='80px';
$size_type='80px';
$size_src='160px';
$size_proposal='180px';
$size_query='178px';
}
else if ($browser=='Internet Explorer'){
$size_date='60px';
$size_lg='35px';
$size_doc='95px';
$size_type='96px';
$size_src='186px';
$size_proposal='210px';
$size_query='210px';
}
echo "<tr class=\"totr\">
<td width=$size_date><div class=\"totd\"><font size=2>$date</font></div></td>
<td width=$size_lg><div class=\"totd\">$iso</div></td>
<td width=$size_doc><div class=\"totd\">$doc_name</div></td>
<td width=$size_type><div class=\"totd\">$doc_type</div></td>
<td width=$size_src><div class=\"totd\">$reference</div></td>
<td width=$size_proposal><div class=\"totd\">$proposal</div></td>
<td width=$size_query>
<div class=\"totd\">
<a href=\"popup.php?query_id=$query_id\" onclick=\"return !window.open(this.href,null,'width=610,height=690, status=no, directories=no, toolbar=no, location=no, menubar=no, scrollbars=yes, resizable=yes');\"><font color=\"blue\">$query</font></a>
</div>
</td>
...
?>
</table>
</div>

et voici le contenu de ma feuille de style:

Code :

table#mainTable1{
width:100%;
text-align:center;
border:1px solid #AF0F01;
border-collapse : separate;
background-color:#E3E4E8;
overflow: auto;
}
.totd{
padding: 0px;
height:40px;
overflow:auto;
text-align:center;
border:1px solid #AF0F01;
}
.totr {
padding: 0px;
font-style: italic;
text-align: center;
background-color: #E3E4E8;
}
.maindiv{
width:100%;
height:210px;
overflow:auto;
}

Merci d'avance

dartyduck

n00b AttitudE

tu aurais un lien pour montrer de quoi ca a l'air ?
Et le php je connais un peu, mais y'a des personnes plus compétentes que moi pour t'aider.
Moi je t'ai corrigé ton style pour qu'ensuite il ne reste que le php à regarder. mais envoie un lien.

---------------
Nikon D7000 + 18-105VR + 35mm 1.8

bignose

Il me semble que le <tr> du dernier echo n'est pas fermé...

Bignose

acorsa

Merci vous 2 mais après 2 jours intenses, je crois avoir trouvé la source de mon problème...mais toujours pas la solution! J'explique: en fait qd il y a une longue chaîne de caractère sans espace Firefox mets automatiquement une scrollbar horizontale (car ds ma css j'ai overflow:auto seulement IE semble ne vouloir mettre que des scrollbar verticales (ce qui n'est pas posible si il n'y a pas d'espace ds le texte car il ne peut pas couper le texte). Do,nc ma question est: comment forcer l'affichage des scrollbar horizontales sous IE!!
Merci

dartyduck

n00b AttitudE

bon alors tu figes la largeur de ta boite (tableau, div, je sais pas moi) et dans ton css tu lui mets un "overflow-x: auto;"
et tu reviens nous donner le résultat

---------------
Nikon D7000 + 18-105VR + 35mm 1.8

acorsa

Ben j'ai déjà essayé...et là je viens de m'apercevoir que qd je mets overflow-x: auto; ça ne me mets même plus les barres verticales!!
J'ai trouvé une solution provisoire qui consiste à raccourcir les textes trop long si il n'y a pas d'espace ds le texte et qu'on est sous IE ms c du bricolage j'aime pas trop ça...
Merci de m'aider!

Publicité

dartyduck

n00b AttitudE

ce que tu peux faire c'est un css juste pour IE ou tu n'y mets que les trucs spécifiques pour IE, et tu mets un

Code :

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="/style-ie.css" />
<![endif]-->

dans ton <head>

---------------
Nikon D7000 + 18-105VR + 35mm 1.8

acorsa

oui ms je vois pas à quoi ça sert puisque je ne sais toujours pas comment faire pour que ça s'affiche bien sous IE!!

Message cité 1 fois

bignose

T'as essayé de fermer le <tr> ?

acorsa

oui oui!!

dartyduck

n00b AttitudE

acorsa a écrit :

oui ms je vois pas à quoi ça sert puisque je ne sais toujours pas comment faire pour que ça s'affiche bien sous IE!!

le code que je t'ai mis est là pour appeler un code css spécial IE ou tu ne mets que les parties que tu veux adapter à l'affichage IE. Et du coup, ca s'affichera bien et sous IE et sous FF ! tu auras 2 feuilles de style.
La principale qui marche bien sous FF et une petite qui permettra aux trucs qui s'affichaient mal sous IE de bien s'afficher sous IE !

---------------
Nikon D7000 + 18-105VR + 35mm 1.8

FORUM HardWare.fr

Programmation

HTML/CSS

Problème d'affichage d'un tableau

Sujets relatifs
Probleme avec FullCanvas....	probleme de connection à SQLSERVER2005
[Crypto] Probleme dans ce programme?	affichage xml dans explorer
Probleme de requête (group by)	problème XML vs JS vs IE
Problème avec array_rand	probleme d affichage avec un tableau html
Probleme affichage tableau	probleme d'affichage tableau
Plus de sujets relatifs à : Problème d'affichage d'un tableau

Page générée en 0.177 secondes