Tablet View
SP View
※ 表の下に表だけの横スクロールが表示されています。
※ 表の下に表だけの横スクロールが表示されています。
price_005
横に項目が複数あるテーブル
横に複数の列が必要な表は「表・テーブル」パーツからtableタグで作成することになります。tableで作る表はスマホで見た時、画面幅に無理やり収めて表示されるため各セルでは改行だらけでみにくくなりがちです。
そして、以外な盲点が、連続する半角英数字は改行されない ということです。横に並ぶ項目数が多く、それが半角数字の料金だった時、各セルないで改行されないため、表が画面幅（スマホ時）に収まりきらずに、本来の画面幅からはみ出しようになってしまいます。
このテーブル幅がはみ出すとき、テーブル部分だけを横スクロール処理になるように設定してあります。
Color
| 通常料金 | メンバー料金 | 子供料金 | |
|---|---|---|---|
| リタッチカラー | ¥9,500 | ¥8,550 | ¥5,700 |
| オールカラー | ¥13,500 | ¥12,150 | ¥8,100 |
| デザインカラー | ¥6,000 | ¥5,400 | ¥3,600 |
| ブリーチカラー | ¥10,000 | ¥9,000 | ¥6,000 |
| ダブルカラー | ¥10,000 | ¥9,000 | ¥6,000 |
| マニキュアカラー | ¥9,000 | ¥8,100 | ¥5,400 |
※ 表の下に表だけの横スクロールが表示されています。