Pure CSS でサイドバー/カラム高さ_html/css_WEB-ITnose の自動均等化を実現

ここでは、サイドバー/列の高さを自動的に均等にするための最良の方法だと私が考えるものを直接紹介します。コアの CSS コードは次のとおりです (値は固定されていません):

Margin-bottom:-3000px;padding-bottom:3000px;

親タグの overflow:hidden 属性を使用すると、自動高さ均等化の効果が得られます。達成される。

簡単な例として、次の CSS と HTML コードを見てみましょう。フロート:左;} .right{幅:400ピクセル; パディング-ボトム:3000ピクセル; 背景:#f0f3f9; .センター{マージン:0 410ピクセル 0 210ピクセル; height:600px;}

左、高さ属性なし、最上位の列の高さに適応します

"right"> 右側、高さ属性なし、最上位の列の高さに適応

中央、高さ 600 ピクセル、左右の列の高さが適応それへ