サイドの固定バナーで他コンテンツが隠れてしまう

Question

お世話になります。
前回ご助言頂き、YahooトリプルでPC用とスマホ用トップページを作成しました。
現在問題なく動いているようなのですが、ご質問があります。

・質問１
PCトップページ　https://shopping.geocities.jp/***/index.html　の
左サイド・右サイドにそれぞれ固定バナーを設置したのですが
ブラウザを小さくすると他のバナーにかぶさって、見えづらくなってしまいます。
左の背景バナーのCSSへは以下のタグを入れてみましたが、変わりませんでした。
@media (max-width: 1200px) {
#tateobi1 {visibility:hidden;}
 }
どのように修正すれば良いでしょうか。

・質問２
現在スマートフォン版のトップに戻るたび「スマホ版を表示しますか？」
と出るのですが、表示させない方法はありますか？

質問が2つになってしまい申し訳ありません。どうぞよろしくお願いいたします。

Answer

ECマスターズの伊藤です。

質問１
> ブラウザを小さくすると他のバナーにかぶさって、見えづらくなってしまいます。
> 左の背景バナーのCSSへは以下のタグを入れてみましたが、変わりませんでした。

class="sample" → .sample
id="sample" → #sample

となります。
頂いておりましたコード内の tateobi1 は class で
記述頂いておりましたので

@media (max-width: 1200px) {
.tateobi1 {visibility:hidden;}
}

に修正していただきますよう、お願いいたします。


質問２
> 現在スマートフォン版のトップに戻るたび「スマホ版を表示しますか？」
> と出るのですが、表示させない方法はありますか？

ページ内で、上記の内容が表示されるように設定されているようです。
不要でしたら下記を削除していただきますよう、お願いいたします。

＝＝＝＝＝＝＝＝＝＝



＝＝＝＝＝＝＝＝＝＝

なお、上記を削除しますと、PC版アクセスの際にスマホ版の表示ができなくなります。

スマホでPC版にアクセスした場合に、自動的にスマホ版に飛ばすには、
リダイレクトの設定をお願いいたします。

リダイレクトの設定方法は、下記マニュアルをご参照くださいませ。
https://store-info.yahoo.co.jp/s/shopping/toolmanual/triple/d/806.html

Answer

伊藤様ありがとうございます。
.tateobiに修正しましたら希望通りの表示になりました。cssが不得手で失礼しました。理解できました。

javascriptですが、削除すると確かにスマホでPC版トップしか表示されなかったので
一旦そのままにしておきレスポンシブ対応のページも考えてみます。
ありがとうございます。

Answer

ECマスターズの伊藤です。

> .tateobiに修正しましたら希望通りの表示になりました。cssが不得手で失礼しました。理解できました。

無事、ご希望どおりの表示となったようで、安心致しました。
CSSもご理解いただけたようで、良かったです。


> javascriptですが、削除すると確かにスマホでPC版トップしか表示されなかったので
> 一旦そのままにしておきレスポンシブ対応のページも考えてみます。

かしこまりました。
もし、マニュアルをご覧いただき、ご不明な点がございましたら
改めてご質問くださいませ。