1. ホーム
  2. html

[解決済み] HTML テーブル: 列の幅を同じにする

2023-05-24 20:42:03

質問

いくつかの列のグループを持つテーブルがあります。テーブルは私のページよりも大きいので、私はページに合うようにこれらのグループのいくつかを表示/非表示にするコントロールを持っています。最初のテーブルは、グループ内のすべての列がほぼ同じ幅であるため、見た目は良いです。しかし、私がグループを隠すと、列はもう同じ幅ではなく、それは悪いように見えます。

http://www.reviews-web-hosting.com/companies/apollohosting.html (リンク切れ)

ここまでは、問題なさそうな表です。>> をクリックしてください。すると、"Ecommerce Pro"の最初の列が、"Ecommerce Pro"の他の列よりずっと幅が広く、変な感じになっています。<< をクリックすると、今度は "Value" の下の最初のカラムの幅が広くなりすぎています。少なくともFirefoxでは。

を使おうとしたのですが

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

と表示されるのですが、うまくいきません。colをstyle="display: none"にすると、列のセットは表示されたままです。

グループ内で同じ幅の列を維持するための任意のHTML / CSSのヒント?

編集してください。

  • を使用してカラムを隠すには、visibility: collapse を使用する必要があります。
  • は、現在、うまくリサイズされているようですが、私はなぜかわからない

どのように解決するには?

スタイルを設定すると table-layout: fixed; を設定すると、ブラウザの自動列サイズ変更機能を無効にすることができます。この場合、ブラウザはテーブルの最初の行のセルの幅に基づいて列の幅を設定します。テーブルの <thead><caption> を削除し <td> の中のセルに固定幅を設定します。 <tbody> .