今回はページの左右に余白をとっているデザインを再現しましたが、携帯サイトでページの左右に余白をとるのは個人的にはすっごく避けたいデザインです。tableの使用が必須になってきてしまいますし、コンテンツの中身でどうしてもtableの使用が必要となってきたときに、tableの入れ子ができないので色々と面倒なことになります。
なので、モバイルサイトのデザインをする際は、両端に文字をぴったりとくっつけたデザインをしていただきたいなーと常々思ってます。意図的にどうしてもあけたいのか、PCサイトのデザインをする感覚であけてしまっているのかが分からないので毎回困ります。うぐぐ...
今回の条件下でコーディング可能なものにデザインしなおしたものです。
サンプルページ
<画像:QRコード>
→サンプルページを見る
※絵文字は3キャリア対応をしていないので、sbで団子になってます。