Table HTML trop large dans IE7

J'ai une table qui affiche bien dans Chrome, IE8 et IE9. Dans IE7, cependant, la table finit par être beaucoup plus large que son contenu (100% de l'élément contenant?). Comment puis-je rendre la table aussi large que son contenu dans IE7 et IE6 (et continuer à afficher bien dans les navigateurs plus récents)?Table HTML trop large dans IE7

Voici le tableau:

<table class="SisSubDetailTable"> 
    <tbody> 
     <tr> 
      <td>Date:</td><td>10-16-11</td><td>SOID:</td><td>SUST — Sustaining                       </td> 
     </tr> 
     <tr> 
      <td>Status:</td><td>25 characters' worth of data</td><td>Work Order:</td> 
      <td>  </td> 
     </tr> 
     <tr> 
      <td>Company:</td><td>6K8 — KAPCO</td><td>Sub:</td><td>9999 </td> 
     </tr> 
     <tr> 
      <td>Store:</td><td>34 characters' worth of data</td><td>Export Price:</td> 
      <td>$0.00</td> 
     </tr> 
     <tr> 
      <td>Class:</td><td>26 characters' worth of data</td><td>Control Ship:</td> 
      <td>N</td> 
     </tr> 
    </tbody> 
</table>

Le CSS suivant semble rendre les cellules étroites, mais la table dans son ensemble est encore beaucoup plus large que 400px:

table.SisSubDetailTable 
{ 
    width: 400px; 
} 

table.SisSubDetailTable td 
{ 
    border-width: 0; 
    width: 100px; 
}

Source

2012-06-29 birdus

En fait, le CSS ci-dessus rend l'habillage de texte comme si la cellule est réellement 100px de large, mais la bordure de la cellule est encore un peu plus large que le texte. Étrange. – birdus

Autre chose intéressante: la cellule qui n'a pas de données n'apparaît pas dans IE7, bien que je ne pense pas que cela rende les cellules et la table si larges. C'est une observation intéressante, cependant. – birdus

Vous devez définir sa largeur propriété en css. Utilisez devinez et vérifiez pour voir combien vous le voulez.

Source

2012-06-29 22:04:18 dezman

Je ne sais pas quelle devrait être la largeur à l'avance. Je ne peux pas simplement avoir la table aussi étroite que les données? – birdus

Désolé, il n'y a pas de règle de rétrécissement à ajuster, vous allez devoir le tester, essayer 300px, puis ajuster. Cela ne devrait prendre qu'une minute. – dezman

On dirait de définir la largeur avec l'aide de! Important définit la largeur. Je suppose que je vais juste charger un fichier CSS différent pour les navigateurs précédents, mais laisser la nature suivre son cours pour les plus récents. Merci. – birdus

Si vous ne le faites pas déjà, définissez la valeur en pixels et évitez les autres unités.

Source

2012-06-29 22:05:20 Joe

Table HTML trop large dans IE7

Répondre

Questions connexes