テーブルや JavaScript を使用せずに次の構造を実現するにはどうすればよいですか? 白い境界線は div の端を表しており、質問とは関係ありません。
中央の領域のサイズは変化しますが、正確なピクセル値を持ち、構造全体がそれらの値に応じて拡大縮小される必要があります。これを簡素化するには、上中央と下中央の div に「100% - n px」の幅を設定する方法が必要です。
クリーンなクロスブラウザソリューションがあればありがたいのですが、それが不可能な場合は、CSS ハックでも構いません。
ボーナスです。私が苦労して、最終的にテーブルまたは JavaScript を使用するようになった別の構造です。少し異なりますが、新しい問題が発生します。私は主に jQuery ベースのウィンドウ システムでこれを使用していますが、レイアウトをスクリプトから切り離し、1 つの要素 (中央の要素) のサイズのみを制御したいと思います。
ベストアンサー1
私が偶然見つけた新しい方法:csscalc():
.calculated-width {
width: -webkit-calc(100% - 100px);
width: -moz-calc(100% - 100px);
width: calc(100% - 100px);
}