2017/09/24
Twenty Eleven の左コンテンツを選んで、カスタマイズして使っているのだけど、コンテンツとメニューの幅を少し変えたいな…と。
左マージン コンテンツ 中マージン メニュー 右マージン
7.6% 58.4% 7.6% 18.8% 7.6%
となっているところを
左マージン コンテンツ 中マージン メニュー 右マージン
6% 60% 7.5% 23.5% 3%
のようにしてみたい。
スタイルシートstyle.cssの
/* =Structure
———————————————– */
のセクションにある
#primary { float: left; margin: 0 -26.4% 0 0; width: 100%; } #content { margin: 0 34% 0 7.6%; width: 58.4%; } #secondary { float: right; margin-right: 7.6%; width: 18.8%; }
を変更していく。
プライマリの-26.4%ってのは、メニュー18.8%+右マージン7.6%で、
コンテンツの34%というのは、プライマリの26.4%+中マージン7.6%ってことになる。
なので…
#primary { float: left; margin: 0 -31% 0 0; width: 100%; } #content { margin: 0 34% 0 6%; width: 60%; } #secondary { float: right; margin-right: 3%; width: 23.5%; }
と変更。リロードしてみると、思った通りにいったみたい。