解決済み
Question

ロゴのサブタイトルが一段に収まらない件(2)

  • えみこ(Emiko)
  • 以前上記の件名で質問させていただき、おかげさまで解決いたしましたが、スマホ画面をクリックして見るとサブタイトルがタイトルと被ってしまいました。
    何度も恐縮ですが、解決策をご教示いただけませんでしょうか。

    また、記事スライドがスマホ画面だと切れてしまいますが、どのような設定が必要でしょうか。
    実際のスマホ画面ではきれいに表示されていますが、カスタマイズの画面とは違うのでしょうか。
    何卒よろしくお願いいたします。

    問題となるページ : https://cyoppirihageko.com/
    • WP 6.1系
    • JIN:R 1.0.9
    • Conoha Wing
    • Windows11
    2023/04/01 15:29
  • tsu_

    こんにちは!

    "スマホ画面をクリックして見るとサブタイトルがタイトルと被ってしまいました。"
     ↓
    スマホの画面幅によって変わってくる部分なのでアレですが、以下の追加CSSで対応できるかもしれません!

    12の部分の数値を変えながら調整するのも良いと思います。
    これ以上は、ちょっと意図を汲み取れなくなってきますので、えみこさんご自身でご対応いただけると嬉しいです。

    @media (max-width: 551px) {
    .d--header-layout1 #headerLogoLink {
    margin-top: 12px;
    }
    }


    "また、記事スライドがスマホ画面だと切れてしまいますが、どのような設定が必要でしょうか。
    実際のスマホ画面ではきれいに表示されていますが、カスタマイズの画面とは違うのでしょうか。"
     ↓
    これはどこの部分ですか??
    スクリーンショットなどのご共有をお願いできると...

    また、基本的には実際のスマホ画面を優先して考えていただければと思います!

    ご確認よろしくお願いいたします。

    2023/04/02 17:19
  • えみこ(Emiko)

    ご返信ありがとうございます!分かり難い文章で申し訳ございません。画面を添付いたしました。

    カスタマイズからスマホのマークをクリック(写真の黄色の丸)するとスマホサイズになりますが、タイトルが被ってしまうのと、記事スライドが半分しか表示されません。
    実際のスマホではちゃんと表示されています。
    パソコンサイズからスマホに切り替えて全体の感じを見たかったのですが、実際のスマホからしか確認出来ないのでしょうか。

    2023/04/03 17:46
  • tsu_

    そうですね、、、カスタマイズ画面でのそちらの機能ではなくてスマホ本体で確認するのが良いと思います!

    PCで確認したいのであれば、ブラウザの機能を使って確認することも可能です。

    お使いのブラウザが書かれてないので違ったら申し訳ないですが、↓の記事ではGoogle Chromeの場合のやり方が説明されています。
    https://pc-karuma.net/how-to-view-mobile-version-of-a-website/

    ご確認よろしくお願いいたします!

    2023/04/04 12:07
  • えみこ(Emiko)

    ご返信ありがとうございます。
    ブラウザが何なのか分からず記載できておりませんでした。Chromeではなさそうなのでスマホで見ながら作業します。せっかく教えていただいたのに、申し訳ございません。

    2023/04/10 13:19
CLOSE