左右動くﾊﾞﾅｰの並べ方

Question

お世話になります。
会員の方の質問問答を参考に左右に動くﾊﾞﾅｰを作成しました。
下記サイトを参考にしました。
↓↓↓
http://item.rakuten.co.jp/auc-luire/c/0000000142/

このように３個ほどバナーを並べたいのですが、
どうしても１個しか表示できません。
何か止める？ようなタグが必要なようです。
お教えいただけますか。
よろしくお願いいたします。
田中さんの参考にさせて頂いたタグは以下です。

===== この下の行から ================
 （バナーの内容）
 
 #sidefixedbanner {
 top: 100px; /* ←数字を増やして、上からの位置を調整できます */
right: -100px; /* 
 ↑画像の隠したい部分の長さを指定してください。
 左端に固定する場合は、rightをleftに変更してください。 */
z-index: 10;
 display: block;
 width: auto;
 position: fixed;
 transition: 0.5s; /* ←数字を減らすと、動きが速くなります。 */
 }

 #sidefixedbanner:hover{
 right: 0px;
 }
 
 ===== この上の行まで ================

Answer

ECマスターズの田中です。

ページを確認したところ、
クーポンバナー、レビューバナー、両方で同じID「sidefixedbanner」が使われております。

ページ内の要素を特定するためのIDは、
同じページの中に一つだけある状態でなくてはなりません。
現在のままですと、後に定義されたレビューバナー用のスタイルシートが
両方のバナーに適用され、重なって表示されてしまっております。

たとえば、レビューバナーの3箇所に含まれる
「sidefixedbanner」に「2」を追記して「sidefixedbanner2」にするなどして、
IDが重複しないように調整をお願いします。

Answer

田中さんいつもお世話になります！
ありがとうございます。

解決いたしました！

Answer

ECマスターズの田中です。

当質問にていただいたような、
画面に固定されるバナーを簡単に設置できる
「バナー設置君」を作成いたしましたので、
全体公開前に、当質問への返信として、
先行してお知らせさせていただきます。

HTMLやスタイルシートを書くことなく、
完成したHTMLをヘッダー・フッター・レフトナビに貼り付けるだけで
固定バナーを簡単に設置することができます。

オプションを詳しく設定することで、
マウスを乗せると動いたり、半透明になったり、
IDを変えることで複数設置することも可能です。

もし、新しいバナーに入れ替える機会などありましたら、
ぜひ、下記URLより「バナー設置君」をお試しいただき、
わかりづらい点やご希望などございましたら
お知らせいただければと思います。
https://ec-masters.club/fwd3/fixedbannerkun