楽天アプリの検索からページを見たときの崩れについて

Question

PCでもスマホでもベラウザで見た場合は崩れていないのですが、楽天アプリの検索からページを開いた時にだけ多少の崩れがあります。
アプリでもショップのトップに張ってあるリンクから飛んだ場合は崩れていないのですが、商品を検索して開く時だけ、崩れてしまいます。
崩れるというのは、タグで2×2の表があるのですが、その表だけレスポンシブ対応されずに、左の1列だけ見えているという状態になります。

こういった場合にだけ崩れるというのはどのような原因が考えられるでしょうか？
よろしくお願いします。

Answer

ECマスターズの田中です。

実際のページを確認しないと正確にご案内できないのですが、
問題となっている表、もしくは説明文内に含まれる他の要素が
画面の横幅を超えていることが原因です。

スマートフォン用ページでは、
ページ内のスタイルシートによって、
可能な限り画面の横幅を超えないように
制限がかかっているのですが、

アプリで商品ページを閲覧した際の
スマートフォン用商品説明文の表示枠では
ありのままのHTMLで表示しているため、
画面の横幅を超える要素が
そのまま表示されてしまいます。

もし、表が原因でしたら

のようにwidth属性を加えることで
改善される可能性がございますが、

それで解決しない場合は、
横幅を超えている原因を突き止めて
横幅を縮める必要がございます。

もし、解決できない場合は、
実際の見た目を確認させていただく必要がございますので、
確認できる商品管理番号をお知らせいただきますようお願いします。
フォーラムにてご返信いただきづらい場合は、
「投稿内容について報告する」よりお知らせください。

Answer

ご返信ありがとうございます。

table width の設定を試してみましたが、改善されませんでした。

お手数ですが、実際のページのご確認をお願いできますでしょうか。
商品管理番号［tsukinoomamaori_sup］
URL[https://item.rakuten.co.jp/putiselect/tsukinoomamaori_sup/] 

下の方にある「月のおまもりシリーズ」と書かれた表が、アプリで検索から飛んだときにだけサイズがおかしいです。

よろしくお願いします。

Answer

ECマスターズの田中です。

ご返答までにお時間をいただいてしまい、
大変失礼いたしました。

いただいた商品ページにて状況を確認したところ、
「月のおまもりシリーズ」と書かれた表に含まれる
各タグにwidthの指定がなく、
結果として、原寸大で表示されておりましたので、
一律で width="100%" のご記入をお試し願います。

なお、その下にある「商品名」から始まる表も
width="400" という固定値が設定されており、
iPhone 11を始め、多くの機種にてページからはみ出しておりますので、
こちらも、width="100%" への変更をお試し願います。