Existe-t-il un moyen de masquer les lignes de tableau sans affecter la largeur globale de la table? J'ai javascript qui montre/cache certaines lignes de la table, mais lorsque les lignes sont définies sur display: none;
, la table avec rétrécit pour s'adapter au contenu des lignes visibles.Masquage des lignes de la table sans redimensionnement de la largeur totale
Répondre
Si vous cherchez à préserver la largeur totale de la table, vous pouvez le vérifier avant de cacher une rangée, et définir explicitement la propriété de style valeur de cette largeur:
Cependant, cela peut causer les colonnes individuelles à refaire quand vous cachez la ligne. Un moyen possible d'atténuer cela est d'ajouter un style à votre table:
table {
table-layout: fixed;
}
Pour référence, la solution de Levik fonctionne parfaitement. Dans mon cas, en utilisant jQuery, la solution avait l'air quelque chose comme ceci:
$('#tableId').width($('#tableId').width());
En CSS, sur votre table indique au navigateur pour honorer les tailles que vous avez spécifié pour des hauteurs et largeurs. Cela supprime généralement le redimensionnement automatique par le navigateur à moins que vous n'ayez donné aucune indication sur les tailles préférées de vos lignes et colonnes.
merci pour fournir une explication du comportement – garrow
Vous pouvez le faire en utilisant HTML pur
<table border="1">
<colgroup>
<col width="150px" />
<col width="10px" />
<col width="220px" />
</colgroup>
<tr>
<td valign="top">1</td>
<td> </td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td> </td>
<td>4</td>
</tr>
</table>
... jusqu'à ce que vous redimensionnez la fenêtre, puis la largeur fixe de la table ne redistribue pas plus, car il est maintenant une largeur de pixel fixe ... – ijw