HTML largeur de la Table dans IE?

Je suis a l'aide du tableau pour afficher un ensemble de données, mon code HTML qui va ici...

<table border="1" cellspacing="0" cellpadding="0" style="width: 780px;">
  <tbody>
    <tr>
      <td style="width: 780px; height: 25px;">
        <pre width='100' style='width: 780px; word-wrap: break-word;'>
            the data goes here.....
        </pre>            
      </td>
    </tr>
    <tr>
      <td style="width: 780px; height: 25px;">
        <pre width='100' style='width: 780px; word-wrap: break-word;'>
            the data goes here.....
        </pre>            
      </td>
    </tr>
  </tbody>
</table>

ce tableau fonctionne bien sous firefox, safari et IE8. Mais le problème surgit dans IE7, IE6.. asthe tableau s'étend et sort de l'écran(j'.e étend vers la droite dans l'axe des x)....
est-il un hack pour résoudre ce problème?

les captures d'écran de IE6 dans IETester:

HTML largeur de la Table dans IE?

InformationsquelleAutor Harish Kurup | 2010-06-14
  1. 19

    Utiliser le CSS ci-dessous et cela devrait empêcher votre table de dépassement de la taille maximale que vous définir:

    table{
  table-layout:fixed;
}
    • table-layout n'a pas fonctionné pour moi, en essayant de la <colgroup> <col width="10px"> </colgroup> a fait le travail.
    InformationsquelleAutor Pete
  2. 2

    Vous pouvez également essayer le style word-break: break-tous;

    • j'ai résolu mon problem...by la réponse ci-dessus....et je vais essayer d'utiliser word-break de la règle, et vérifier si cela fonctionne avec tous les navigateurs...et merci à u @Rodéo Ramsey...
    • où est ce style censé être appliqué? besoin de voir un exemple
    InformationsquelleAutor RodeoRamsey
  3. 2

    Le problème est résolu, comme je l'ai utilisé le code que

    <table border="1" cellspacing="0" cellpadding="0" width="780" style="table-layout:fixed">
<col width="780">
<tbody>
<tr>
  <td style="width: 780px; height: 25px; overflow:hidden;">
    <pre width='100' style='width: 780px; word-wrap: break-word;'>
        the data goes here.....
    </pre>            
  </td>
</tr>
<tr>
  <td style="width: 780px; height: 25px; overflow:hidden;">
    <pre width='100' style='width: 780px; word-wrap: break-word;'>
        the data goes here.....
    </pre>            
  </td>
</tr>
</tbody>
</table>

    dans le code ci-dessus, il y a trois changements...

    1. dans la balise de la table de la largeur de définir l'attribut(au lieu de le placer à l'attribut style)
    2. col de la balise est définie avec la même largeur que la largeur de la table
    3. et en TD style le débordement est la valeur hidden,(débordement:caché).

    J'ai eu cette info à partir du lien donné ci-dessous, veuillez tout le monde check out...
    "http://www.tek-tips.com/faqs.cfm?fid=4499"
    et donc mon problème a été résolu.

    InformationsquelleAutor Harish Kurup
  4. 0

    Essayer 

    <table border="1" cellspacing="0" cellpadding="0" width="780">
    • non il ne fonctionne pas avec IE7 et IE6.. élargi encore vers la droite...
    • est-il le seul contenu sur votre page peut-être ce qui arrive à cause de vous de l'utiliser dans certains div.vérifier ce qui se passe avec le seul code donné si pas si.
    InformationsquelleAutor Salil
  5. 0

    Je viens de tester à l'aide de votre code HTML et elle a regardé à l'identique dans IE6, IE8 (mode de compatibilité) et IE8 (mode normal), ainsi que la même dans Firefox.

    Quelque chose sur votre page web doit être modifier la disposition, de sorte s'il vous plaît poster un exemple complet.

    C'est l'exemple complet que j'ai testé.

    <html>
    <body>
        <table border="1" cellspacing="0" cellpadding="0" style="width: 780px;">
          <tbody>
            <tr>
              <td style="width: 780px; height: 25px;">
                <pre width='100' style='width: 780px; word-wrap: break-word;'>
                    the data goes here.....
                </pre>            
              </td>
            </tr>
            <tr>
              <td style="width: 780px; height: 25px;">
                <pre width='100' style='width: 780px; word-wrap: break-word;'>
                    the data goes here.....
                </pre>            
              </td>
            </tr>
          </tbody>
        </table>
    </body>
</html>
    • en fait, ce tableau est formé de manière dynamique au backend à l'aide de PHP...il y a headers.php, footers.php et content.php en formant cette page...
    • D'où l'importance de nous montrer l'ensemble de la page afin que nous puissions re-créer le problème.
    InformationsquelleAutor Fenton