CSSテーブルで、最初の列のパディングされた要素が2番目の列のdivに影響を与える理由を誰かが理解するのを手伝ってもらえますか?
段落にパディングが設定されている例を次に示します。右の列のDIVも-誤って-パディングされています。左側の列のコンテンツで行の高さを指定するときに同様の問題が発生しましたが、この質問の例を簡略化しました。
テーブルセルについては類似した/関連する質問がたくさんありますが、この質問に具体的に対処する質問は見つかりませんでした。
CSSテーブルで、最初の列のパディングされた要素が2番目の列のdivに影響を与える理由を誰かが理解するのを手伝ってもらえますか?
段落にパディングが設定されている例を次に示します。右の列のDIVも-誤って-パディングされています。左側の列のコンテンツで行の高さを指定するときに同様の問題が発生しましたが、この質問の例を簡略化しました。
テーブルセルについては類似した/関連する質問がたくさんありますが、この質問に具体的に対処する質問は見つかりませんでした。
おそらく、セルクラスでvertical-alignプロパティ(vertical-align:top
)を使用するか、jsfiddle.net / j08691 / APXT7/4のようなdivを使用できます。これらのdivはテーブルセルとして表示されているため、これが探しているものである可能性があります。
これは、パディングの問題ではなく、行の高さの問題である可能性が最も高いです。つまり、疑うかもしれませんが、実際には右側の列にパディングが伝播されていません (計算された値はまだゼロです)。私はまだ、要素のパディングを調整することの副作用と呼んでいます。p
要素の上部と下部のパディングは、p
ベースラインを押し下げます。これにより、同じ行/行にある他の「セル」のベースラインもシフトします。もちろん、仕様で概説されているすべての核心を見つけることができますが、両方の「セル」の垂直方向の配置が同じであるため ( baseline
)、一方がシフトされたときに整列する必要があります。