Foundation グリッド - 小型デバイス

Foundation のグリッド例：小型デバイス

2 カラムの単純なレイアウトを持っているものと仮定します。小型デバイス用に、25%/75% にカラムを分割しようと思います。

チップ: 小型デバイスは、40.0625em 以下の 画面幅を持つものと定義されています。

小型デバイスには、.small-* クラスを使用します。

2 つのカラムに、次のクラスを追加します：

これは、「小型の画面サイズでは、その中から .small を持つクラスを探して、それを使用する」ことを意味します。

次の例は、すべてのデバイス上で 25%/75% の分割となります（Foundation はモバイル・ファースト： 他に何も指定しない場合は、より大きなデバイスは、.small クラスからコードを継承します）：

	注: 合計は、いつも 12 になることを確認してください！

33.3%/66.6% の分割には、.small-4 と .small-8 を使用します：

次の章では、中型デバイス用に、異なる分割パーセントの追加方法を示します。