超簡単【CSS追加不要】Amazonアソシエイト｜商品リンクの縦並びを横並びで表示させる方法

こんにちは。

日本も言論の自由が無くなってきているきがするのは私だけでしょうか？
（これ、今度書こう…別に誰の為でもなくていい。）

今回は、Amazonの商品リンクみ見た目を改善する簡単な方法です。
とっても簡単でした。

<div>タグで囲むだけ</div>

はい、見出しそのままです！笑

以上。

はい、すみませんでした。

Before

Amazonアソシエイトの商品リンク画像は、スマホもパソコンも縦並びに表示されてしまいます。

しかも左に寄ってしまってバランス悪い…

それを解消したい！

簡単に横並びにする方法

<div>……html……</div>

同じカスタムHTMLに複数のコードを貼ります。
<iframe>から</iframe>までがひとつの商品リンクのHTMLです。

それを、<div></div>で囲います。

<div>
<iframe>
…………………..
</iframe>

<iframe>
…………………..
</iframe>

</div>

After

これだけで、横並びに表示可能です。

スマホ表示（イメージ画像）

パソコン表示（イメージ画像）

実際の商品リンク

まとめ

ここまでご覧いただきありがとうございます。

これで見た目がスッキリしました。

少しでもお役に立てたら嬉しいです。