html - HTML CSSフォーマット：テーブル行はコンテンツの高さを継承します

Question

コンテンツの高さを継承するようにテーブル行をフォーマットするにはどうすればよいですか？こんなものが欲しいここに画像の説明を入力してください

私が試してみました

table{
   table-layout:fixed;
   width:700px;
 }

しかし、それは機能しません

score 4 · Accepted Answer

通常、テーブルは、テーブル全体の幅のパーセンテージまたは絶対ピクセルの「px」定義のいずれかを使用して列の幅が定義されている場合、コンテンツの高さを継承します。さらに、テーブルの行に指定された高さ、つまり「height：30px」がないことを確認してください。

コードソリューション：

table {
  width: 700px;
}
table tr td {
  width: 350px;
  height: auto;
}

score 0 · Accepted Answer

要素はその子孫から継承できず、アセンダントからのみ継承できるため、行はセルから継承を継承できません。ただし、テーブルの行の高さの計算では、テーブルの高さのアルゴリズムによって、セルの高さの要件が自動的に考慮されます。

これは、提示された例でも発生します。与えられたスタイルシートと可能な限り単純なテーブルマークアップを使用すると、垂直方向の配置は別として、結果は要求どおりになります。その調整は別の問題であり、で簡単に処理できtd { vertical-align: top }ます。

ページがそのように動作しない場合は、問題を示す例（HTMLおよびCSSコード）を提供してください。

2 に答える 2