CSSで段組レイアウトのテンプレートメニュー
公開：2015-10-21
更新：
CSSで段組みレイアウトのテンプレートのメニューです。2段組/3段組、サイドバー可変幅/固定幅、横並び順各種あります。
様々なウィンドウ幅や画面幅に対応するレスポンシブデザインで、デモで実際に検証できます。ソースコードは無料フリーです。
ちなみにCSS自体がサイドバーやコンテンツという概念ではなく、ここでは分かりやすいように、幅が狭い側と広い側でそう呼んでいるだけです。コンテンツは全て可変幅としています。
ページ内目次
2段組：サイドバー固定幅
ウィンドウや画面の幅を広げた際に、B1～B2を以下の順で横並びにします。
左サイドバー ＋ 右コンテンツ
左コンテンツ ＋ 右サイドバー
2段組：サイドバー可変幅
ウィンドウや画面の幅を広げた際に、B1～B2を以下の順で横並びにします。
左サイドバー ＋ 右コンテンツ
左コンテンツ ＋ 右サイドバー
3段組：サイドバー固定幅
ウィンドウや画面の幅を広げた際に、B1～B3を以下の順で横並びにします。
3段組：サイドバー可変幅
ウィンドウや画面の幅を広げた際に、B1～B3を以下の順で横並びにします。
