FoundationのGrid Centered Columnsでページをセンタリングします

Foundation Centered Columns foundation

さらにサイトの制作を進めていきます。FoundationのGridを利用して1カラムのページを組み立てていきます。
まず、FoundationというかCSSフレームワークの一番の使いどころだと思ってますが、ページ全体をセンタリングします。
wrappであっちへ寄せたり、こっちへ寄せたり苦労していたのがウソのような便利な機能です。

/src/layouts/default.htmlを修正します。

  1. l5. lang設定をjaに書き換えます。
  2. l17-18 FoundationのGridでCentered Columnsを利用します。11カラムでセンタリングします。
  3. l23-24 上のタグを閉じます。
  4. FoundationのGridの説明は以下です。

    http://foundation.zurb.com/sites/docs/grid.html

コメント