ヘッダーのバナーをスマホでも表示したい

  • mensdelies

    (@mensdelies)


    6年、 11ヶ月前

    リンクはデモサイトのものです。
    サイト上部のヘッダーのバナーはPCのみで表示されるようですが、
    スマホやタブレット等でも表示できるようにしたいです。

    CSSは下記のような記述になっていますが、どのように修正すればスマホでも表示されるようになるでしょうか？素人な質問ですみませんが教えて下さい。
    /* バナー */
    #header_banner_area { position:absolute; right:0px; top:28px; }
    #header_banner_area a { }
    #header_banner_area a img { display:block; max-width:100%; }

    @media screen and (max-width:1232px) {
    /*@media screen and (min-width:641px) and (max-width:1232px) {*/
    #header_banner_area { padding:20px 15px; float:none; text-align:center; }
    #header_banner_area a img { display:inline; }
    }

    @media screen and (max-width:1232px) {
    /*@media screen and (max-width:641px) {*/
    #header_banner_area { display:inline; }
    }

    よろしくお願いします。

    ヘルプの必要なページ: [リンクを見るにはログイン]

3件の返信を表示中 - 1 - 3件目 (全3件中)
  • CG

    (@du-bist-der-lenz)

    6年、 11ヶ月前

    素人発想ですがメディアクェリをコメントアウトしてはどうでしょう

    kautakku

    (@kautakku)

    6年、 11ヶ月前

    responsive.cssを変更するとかですかね

    @media screen and (max-width:1232px) {
/*@media screen and (max-width:641px) {*/
  #header_banner_area { display:none; }
}

    上記を以下に変更したら表示されますよ。

    @media screen and (max-width:1232px) {
/*@media screen and (max-width:641px) {*/
  /*#header_banner_area { display:none; }*/
  #contents {
    margin-top: 9vmin;
  }
}

    margin-topは画像の大きさに合わせて、またメディアクエリを使って良い感じに調整してくださいね。

    トピック投稿者 mensdelies

    (@mensdelies)

    6年、 10ヶ月前

    ご意見くださった方ありがとうございます。

    やってみたのですが、できませんでした。
    有料テーマなのでそちらのほうで解決策を何とか探してみます。

3件の返信を表示中 - 1 - 3件目 (全3件中)
  • トピック「ヘッダーのバナーをスマホでも表示したい」には新たに返信することはできません。

タグ