商品ページを幅いっぱいに表示する記述方法について

Question

お世話になります。

同じような質問がすでにあったらすみません。

PCの商品ページで
http://item.rakuten.co.jp/kobe-beauty-labo/bota-01/
のように、横幅をいっぱいに使ったページを作りたいと思っているのですが、
どのように商品ページの記述をすることによってこのようなページは実現できるのでしょうか？

普通に商品ページに画像を登録するだけでは、横幅に制限がでてしまうので、うまく表示できる
方法を教えて頂ければと思います。

よろしくお願いします。

Answer

ECマスターズの田中です。

楽天の商品ページはタグの組み合わせにより構成されているため、
通常ですと、ヘッダーだけ横幅を広げようとすると
ページ内容やフッターの部分も含め、ページ全体が拡がってしまうのですが、

いただいた商品ページでは、
PC用販売説明文の先頭に

= この下の行から ====================


























= この上の行まで ====================

このように、先頭に閉じタグだけを記載することで、
ページ全体を囲むタグを閉じてしまい、
販売説明文を自由に拡げられるようにしております。

OT1203さんのページでも
同様の方法を取ることで再現していただくことはできると思いますが、
最初の作成時はもちろん、日々行う更新が原因で
ページの構造が崩れ、見た目が乱れてしまう可能性が大きくなりますので、
楽天の商品ページのHTML構造を十分ご理解いただくこと、
また更新の際は変更前の状態にいつでも戻せるよう、
バックアップをしっかり取っていただくことをオススメいたします。