Tableau HTML: conserve la même largeur pour les colonnes

Question

J'ai une table avec plusieurs groupes de colonnes. La table est plus grande que ma page, j'ai donc un contrôle pour afficher/masquer certains de ces groupes pour tenir sur la page. Le premier tableau semble bon: toutes les colonnes sont de la même largeur à l'intérieur d'un groupe. Mais quand je me cache dans un groupe, les colonnes ne sont pas de la même largeur, et de plus, il est mauvais.

Exemple: http://www.reviews-web-hosting.com/companies/apollohosting.html

Jusqu'à présent, le tableau semble parfait. Cliquez sur >>. La première colonne sous "Ecommerce Pro" est beaucoup plus large que les autres colonnes sous "Ecommerce Pro", il semble étrange. Cliquez sur <<, cette fois la première colonne sous la "Valeur" est trop large. Au moins sur Firefox.

J'ai essayé d'utiliser

<colgroup><col /><col span="5" />...

mais pas de chance. Si j'ai mis un col style="display: none", l'ensemble des colonnes est toujours affiché.

Tout code HTML/CSS astuce pour garder les colonnes de même largeur à l'intérieur d'un groupe?

Edit:

• pour masquer une colonne, j'ai utiliser de la visibilité: l'effondrement
• il semble être le redimensionnement et bien maintenant, je ne sais pas pourquoi

Answer 1

Si vous définissez le style table-layout: fixed; sur votre table, vous pouvez remplacer le redimensionnement automatique des colonnes du navigateur. Le navigateur définira ensuite les largeurs de colonne en fonction de la largeur des cellules de la première ligne du tableau. Modifiez vos <thead> en <caption> et supprimez les <td> intérieur de celui-ci, puis définissez des largeurs fixes pour les cellules en <tbody> .

Answer 2

Dans votre cas, puisque vous n’affichez que 3 colonnes:

 Name    Value 	  	Business
  or
Name    Business  	Ecommerce Pro
 

pourquoi ne pas définir tous les 3 pour avoir une largeur de 33,3%. étant donné que seuls 3 sont affichés en même temps, le navigateur doit les rendre tous de la même largeur.

Answer 3

Eh bien, pourquoi ne vous débarrassez-vous pas de la barre latérale et ne pressez-vous pas la table pour qu’elle soit sans effet afficher / masquer? Cela me semble étrange maintenant. La table est trop robuste.
Sinon, je pense que la suggestion de scunliffe devrait le faire. Ou, si vous le souhaitez, vous pouvez simplement définir la largeur exacte du tableau et définir un pourcentage ou une largeur en pixels pour les cellules du tableau.