Fusion de cellules + IE + CSS
Euskamicha
Messages postés
75
Statut
Membre
-
Euskamicha Messages postés 75 Statut Membre -
Euskamicha Messages postés 75 Statut Membre -
Bonjour,
Alors j'ai toujours quelques petits soucis pour l'adaptation de mon site sur IE (j'ai 7 sur le pc en plus donc à priori le moins pire). En fait, mes tableaux ne me servent pas à la mise en page (j'ai bien compris le gain du css par rapport aux tableaux grâce au super tuto du zéro), mais à faire de vraies listes tabulaires. Par exemple, la liste des membres du bureau avec rôle, nom, adresse, tel et @mail.
Et j'ai des commissions qui prennent plusieurs personnes donc j'ai besoin de fusionner certaines cellules, mais c'est là que ça bloque, impossible de faire reconnaitre à IE les notions de colspan et rowspan. J'imagine que c'est un problème connu mais bizarrement je ne trouve pas d'info de réponse sur la toile.
Y'a t-il une astuce? Un truc particulier à faire?
D'avance, merci!
--
Je bosse sur frontpage, mais me taper pas, je débute! Le code ça vient doucement mais surement...
Alors j'ai toujours quelques petits soucis pour l'adaptation de mon site sur IE (j'ai 7 sur le pc en plus donc à priori le moins pire). En fait, mes tableaux ne me servent pas à la mise en page (j'ai bien compris le gain du css par rapport aux tableaux grâce au super tuto du zéro), mais à faire de vraies listes tabulaires. Par exemple, la liste des membres du bureau avec rôle, nom, adresse, tel et @mail.
Et j'ai des commissions qui prennent plusieurs personnes donc j'ai besoin de fusionner certaines cellules, mais c'est là que ça bloque, impossible de faire reconnaitre à IE les notions de colspan et rowspan. J'imagine que c'est un problème connu mais bizarrement je ne trouve pas d'info de réponse sur la toile.
Y'a t-il une astuce? Un truc particulier à faire?
D'avance, merci!
--
Je bosse sur frontpage, mais me taper pas, je débute! Le code ça vient doucement mais surement...
Configuration: Windows XP Firefox 2.0.0.12
2 réponses
-
Heu... ça fonctionne très bien sous IE. Montre nous ton code.
-
Bonjour,
En fait, je viens de comprendre un truc! C'est pas la fusion qui pose problème mais le positionnement du texte dans les cellules, tout est décallé à gauche sur une largeur réduite (beaucoup plus petite que la largeur de la cellule, c'est flagrant sur un autre tableau) malgré le text-align center.
Allez voilà les codes (vous moquez pas quand même!). D'ailleurs si vous avez d'autres remarques autre que sur la fusion, n'hésitez pas!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" > <head> <title>Le Tennis de Table dans les Pyrénées Atlantiques</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/> <script language="javascript" src="../../gestionsite/css/page.js"></script> <link rel="stylesheet" type="text/css" href="../../gestionsite/css/csscompocomite.css"> </head> <body> <!-- ici on mettrait un <div style="float:left;" id="conteneurmenu"> mais l'affichage du menu dans un premier temps, puis son positionnement par le javascript donne un effet desagréble de clignotement. Voici l'astuce pour l'éviter. --> <!-- L'en-tête --> <div id="en_tete"> </div> <div id="conteneurmenu"> <script language="Javascript" type="text/javascript"> preChargement(); </script> <p id="menu1" class="menu" onmouseover="MontrerMenu('ssmenu1');" onmouseout="CacherDelai();"> <a href="../../gestionsite/acceuil.html" onfocus="MontrerMenu('ssmenu1');">ACCUEIL<span> :</span></a> </p> <p id="menu2" class="menu" onmouseover="MontrerMenu('ssmenu2');" onmouseout="CacherDelai();"> <a href="../accueilsectiongestion.html" onfocus="MontrerMenu('ssmenu2');">RETOUR GESTION<span> :</span></a> </p> <p id="menu3" class="menu" onmouseover="MontrerMenu('ssmenu3');" onmouseout="CacherDelai();"> <a href="javascript:history.go(-1)" onfocus="MontrerMenu('ssmenu3');">RETOUR<span> :</span></a> </p> </div> <script language="Javascript" type="text/javascript"> // Vous pouvez éventuellement changer des variables ici // voir la configuration du menu plus bas. Chargement();</script> <!-- Le corps --> <div id="corps"> <h1>Le Comité Départemental</h1> <p> <h2>Composition</h2> </p> <table> <tr> <td>PRESIDENT D'HONNEUR</td> <td>Jean-Claude LARTIGAU</td> <td>L'arrayade-37 allée des Pommiers<br/>40 990 MEES</td> <td>05 58 97 48 67</td> </tr> <tr> <td>PRESIDENT</td> <td>Daniel DUMONT</td> <td>Villa Lagunenzat- Chemin Harriague<br/>64 210 ARBONNE</td> <td>05 59 41 84 11<br/>06 62 86 89 46</td> <td><a href ="mailto:cd64dd@cegetel.net">cd64dd@cegetel.net</a></td> </tr> <tr> <td rowspan="2">VICE PRESIDENTS</td> <td>Michel PITERS</td> <td>Centre Nelson Paillou, siège du CD 64 TT</td> <td>05 59 92 62 64 (T)<br/>06 71 49 27 74</td> <td><a href ="michel.piters@mediafibre.com">michel.piters@mediafibre.com</a></td> </tr> <tr> <td>Jean PICARD</td> <td>Ty Bihan 8 rue du Millet<br/>64 600 ANGLET</td> <td>05 59 63 84 95</td> <td><a href ="mailto:jean.e.picard@wanadoo.fr">jean.e.picard@wanadoo.fr</a></td> </tr> <tr> <td>SECRETAIRE</td> <td>Pascal DESCHAMPS</td> <td>4 route de Luy<br/>64 160 BERNADETS</td> <td>05 59 33 04 19<br/>05 59 33 62 41 (T)</td> <td><a href="mailto:ping64.bernadets@laposte.net">ping64.bernadets@laposte.net</a></td> </tr> <tr> <td>TRESORIER</td> <td>Michel PITERS</td> <td>Centre Nelson Paillou, siège du CD 64 TT</td> <td>05 59 92 62 64 (T)<br/>06 71 49 27 74</td> <td><a href ="mailto:michel.piters@mediafibre.com">michel.piters@mediafibre.com</a></td> </tr> <tr> <td>REFERENT CLUBS</td> <td>Jean-Patrick BAZILE</td> <td>14 place de la Hourquie<br/>64 160 MORLAAS</td> <td>05 59 33 01 74<br/>06 07 82 00 09</td> <td><a href="mailto:jean-patrick.bazile@univ-pau.fr">jean-patrick.bazile@univ-pau.fr</a></td> </tr> <tr> <td rowspan="2">MEMBRES</td> <td>Daniel BARBE-BARAILH</td> <td>7 allées des Fauvettes<br/>64 110 JURANCON</td> <td>05 59 06 39 76<br/>06 64 06 30 49</td> <td><a href="mailto:lesgerbauds@wanadoo.fr">lesgerbauds@wanadoo.fr</a></td> </tr> <tr> <td>Jean LOUSTAU</td> <td>2, rue des tilleuls<br/>64 121 SERRES CASTETS</td> <td>05 59 33 77 67<br/>06 87 83 59 30</td> <td><a href="mailto:jean.loustau@neuf.fr">jean.loustau@neuf.fr</a></td> </tr> <tr> <td>EDUCATEUR SPORTIF DEPARTEMENTAL</td> <td>Christophe BLANCHE</td> <td>44, rue Maréchal Joffre<br>64 000 PAU</td> <td>06 84 01 45 74<br/>05 59 27 48 33</td> <td><a href="mailto:c.blanche.cdst64@orange.fr">c.blanche.cdst64@orange.fr</a></td> </tr> <tr> </table> <table> <td colspan="5">FONCTIONNEMENT DU COMITE</td> </tr> <tr> <td rowspan="7">COURRIER: adressé par @mail <strong>simultanément</strong> aux acteurs suivants</td> </tr> <tr> <td><a href="mailto:cd64dd@wanadoo.fr">Daniel DUMONT</a></td> </tr> <tr> <td><a href="mailto:ping64.bernadets@laposte.net">Pascal DESCHAMPS</a></td> </tr> <tr> <td><a href="mailto:c.blanche.cdst64@orange.fr">Christophe BLANCHE</a></td> </tr> <tr> <td><a href="mailto:michel@cabinet-mauquin.fr">Michel PITERS</a></td> </tr> <tr> <td><a href="mailto:jean-patrick.bazile@univ-pau.fr">Jean-Patrick BAZILE<a></td> </tr> <tr> <td><a href="mailto:jean.e.picard@wanadoo.fr">Jean PICARD</a></td> </tr> <tr> <td colspan="3"><strong>RESULTATS SPORTIFS</strong>: doivent être communiquer le jour même de la rencontre.<br/> Feuille de rencontre à adresser au Comité Départemental des Pyrénées Atlantiques<br/> Centre Nelson Paillou<br/> 12, rue du Professeur Garrigou Lagrange<br/> 64 000 PAU</td> </tr> <tr> <td rowspan="5">COMMISSION TECHNIQUE</td> </tr> <tr> <td>Christophe BLANCHE</td> </tr> <tr> <td>Stéphane REGOURDAL</td> </tr> <tr> <td>Christian ETCHEVERRY</td> </tr> <td>Houchang ZARMEHRZAMIN</td> </tr> <tr> <td rowspan="5">COMMISSION SPORTIVE</td> </tr> <tr> <td>Daniel BARBE-BARRAILH</td> </tr> <tr> <td>Michel PITERS</td> </tr> <tr> <td>Christophe BLANCHE</td> </tr> <tr> <td>Jean LOUSTAU</td> </tr> <tr> <td rowspan="3">COMMISSION ARBITRAGE</td> </tr> <tr> <td>Daniel DUMONT</td> </tr> <td>Jean PICARD</td> </tr> <tr> <td>RESPONSABLE CLASSEMENT</td> <td>José MARCO</td> </tr> <tr> <td>RESPONSABLE CRITERIUM DEPARTEMENTAL</td> <td>Jean PICARD</td> </tr> <tr> <td>DELEGUE AUPRES DE LA LIGUE ET DE LA FFTT</td> <td>Daniel DUMONT</td> </tr> <tr> <td>RESPONSABLE SITE INTERNET</td> <td><a href="mailto:sitecd64tt@free.fr">Michael GIROUD-PIFFOZ</a></td> </tr> </table><br/><br/> </div> </body> </html>
Et le CSS:/***** menu CSS *****/ body { width: 100%; height: 100%; margin: 0px; background-color:#ffff88; } #conteneur { position:relative; height:100%; margin:0; padding:0; } #en_tete { width: 100%; height: 90px; background-image: url("../images/panorama.png"); background-position:top; background-repeat: no-repeat; position:absolute; position:center; top:5px; } @media print { /*A l'impression on cache le menu, marche au moins pour IE, Moz et Opéra.*/ .menu, .ssmenu { visibility:hidden; } } .menu, .ssmenu { background-color:#ffe01f; color:green; font-weight:bold; font-family:"MS Sans Serif", "sans-serif", Verdana, Arial; text-align: center; border:1px solid #EFB; padding:1px; /* width et margin sont au cas où le javascript est désactivé. */ width:15em; margin:1em; } /* .menu = les cases toujours visibles (comme Fichier, Edition... dans un logiciel) */ .menu { text-align:center; font-size:14px; border: 4px; border-style: ridge; border-color: white; } /* .ssmenu = Les parties "déroulantes" qui s'affiche au survol d'un .menu */ .ssmenu { FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#AA8922,endColorStr=#543210); white-space : no-break; font-size:12px; } .menu span, .ssmenu span { /* Ne pas toucher C'est pour cacher les ; en fin de <li>, ce qui permet aux synthèse vocales de prendre une pause dans l'élocution */ display:none; } .ssmenu ul, .ssmenu li { /* Ne pas trop toucher. Les items (les <li>) des sous-menus, notamment pour enlever les puces des liste */ padding:0; margin:0; list-style-type:none; } .menu a, .ssmenu a, .menu a:visited, .ssmenu a:visited { /* Les liens qui ne sont pas sous le curseur. */ color:green; padding:2px 1px; text-decoration:none; /* Ne pas modifier le block, margin et width */ display:block; margin:0px; width:100%; } html>body .menu a, html>body .menu a:visited, html>body .menu a:hover, html>body .menu a:active, html>body .ssmenu a, html>body .ssmenu a:visited, html>body .ssmenu a:hover, html>body .ssmenu a:active { width:auto; } .ssmenu ul:hover, .ssmenu a:hover, .ssmenu a:focus, .menu a:hover, .menu a:focus { /* Les liens sous le curseur. On change les couleurs du texte et de fond, et on enlève le soulignement. */ background-color:green; color:#ffe01f; text-decoration:none; } img { /* Si on met une image dans un lien (par exemple un logo à gauche du lien), pas de bordure car c'est vilain :-p */ border:none; } .ssmenu img { /* un petit espacement entre l'image et le texte du lien <a href="..."><img.../>blabla</a> */ margin-right:2px; } .ssmenu img.hr { /* Encore un peu expérimental, un <hr /> entre deux items pour faire un "séparateur"... */ margin-top:1px; margin-bottom:1px; margin-left:0; margin-right:0; width:100%; display:block; } /* Le corps de la page */ #corps { margin-left: 0%; margin-top: 1%; margin-bottom: 20px; background-repeat: no-repeat; position:absolute; position:center; padding: 0px; color: #009900; border: none; width:100%; } #corps h1 { color: red; text-decoration: none; text-align: center; font-family: Arial, "Arial Black", "Times New Roman", Times, serif; font-size: xx-large; font-weight: bold; text-align: center; } #corps h2 { height: 30px; background-repeat: no-repeat; text-align: center; font-size: x-large; text-decoration: none; font-weight: bold; text-align: center; } #corps h3 { height: 30px; background-repeat: no-repeat; text-align: center; font-size: 14px; font-weight: bold; text-decoration: none; } p { font-size: normal; font-family: "Comic Sans Ms",Arial,"Times New Roman", serif; font-weight: bold; width: 100%; margin: 10 px; } table { border-collapse: separate; empty-cells: hidden; border: none; width: 90%; margin-left:5%; position: center; margin-bottom: 25px; } caption { font-size:18px; font-weight:bold; } tr { height:auto; padding:2px; } td { border: 2px outset #0015f8; height: 50px; width: 150px; background-color: #ffe01f; vertical-align: middle; text-align:center; padding:2px; font-family: Arial,"Times New Roman", serif; font-weight: bold; font-size: 14px; empty-cells: hide; text-decoration: none; margin: 1px; } .clignotant { text-decoration:blink; } a { text-decoration:none; } #pied_de_page { background-color: #ffe01f; border: 8px; border-style: ridge; border-color: white; width:90%; height: 20px; color: green; font-style: italic; font-size: 16px; text-align: center; vertical-align: center; font-weight: bold; margin-top: 5px; position:absolute; margin-left: 5%; margin-bottom:1px; }
bon j'ai tout mis, ça fait un peu long mais peut être que y'a une interaction toute pas bonne! Merci pour votre aide en tout cas!