タブブロックのPCブラウザとスマホの見た目の違いについて。スマホでは文字の色が青色になっている。

0
いいねをした人: 居ません
13件の投稿を表示中 - 1 - 13件目 (全13件中)
  • 投稿者
    投稿
  • #118821
    TarCoon☆CarToon
    参加者
    56

    【お使いの Snow Monkey のバージョン】バージョン: 19.1.6
    【お使いの Snow Monkey Blocks のバージョン】バージョン 18.1.6
    【お使いの Snow Monkey Editor のバージョン】バージョン 9.1.2
    【お使いのブラウザ】
    iOS16.3.1
    スマホブラウザ Safari
    macOS Ventura バージョン13.2.1
    PCブラウザ Safari バージョン16.3
    【当該サイトのURL】
    https://tarcoon.me/jp/shop/
    https://tarcoon.me/jp/community/

    ### 発生している問題
    タブブロックが追加された当時から気になっていた点です。
カスタマイズに関する質問に投稿しようかと思ったのですが、やはりデフォルトでこの状態というのは良くないのではないかと思ったので、こちらに書かせていただきました。

    タブブロックの見た目で、2点気になることがあります。

    1点目は、PCブラウザとスマホでタブの文字の部分の色が違います。
    PCではグレーで表示され、スマホでは青色になっています。
    スマホはiPhone、iPadで確認しました。どちらも青色です。

    ▼PCブラウザ

    ▼PCスマホ

    2点目は、タブブロックのスタイルで、ラインを選択すると、選択中の色が変化したラインがずれて表示されてます。

    ▼ズレてるライン

    よろしくお願いします。

    1
    いいねをした人:
    #118836
    アバター画像キタジマ タカシ
    参加者
    2371

    ご報告ありがとうございます! 気づいていませんでしたので助かります!

    スマホはiPhone、iPadで確認しました。どちらも青色です。

    こちら確認できました。修正します。

    タブブロックのスタイルで、ラインを選択すると、選択中の色が変化したラインがずれて表示されてます。

    iPad Pro 12.9インチ(iOS 16.2 / シミュレーター)の縦横、iPhone 14 Pro Max(iOS 16.2 / シミュレーター)の縦横で確認しましたが、どちらもラインはずれずに表示されていました。ずれるのは iPhone と iPad の両方ですか?また、縦向きでも横向きでもどちらでもずれますか?

    Mac の Safari と Chrome でも確認しましたが、ずれずに表示されていました…。

    0
    いいねをした人: 居ません
    #118857
    アバター画像キタジマ タカシ
    参加者
    2371

    ひとまずボタンの色については Blocks v18.1.7 で修正しました。

    0
    いいねをした人: 居ません
    #118879
    TarCoon☆CarToon
    参加者
    56

    ありがとうございます!

    ひとまずボタンの色については Blocks v18.1.7 で修正しました。

    色は確認しました!

    タブブロックのスタイルで、ラインを選択すると、選択中の色が変化したラインがずれて表示されてます。

    ラインのズレはMac の Safari と Chrome ではずれていません。
    ズレるのはiPhoneとiPadで見るとズレています。
    Safari、chrome関係なくズレていますね。

    ▼iPhone

    ▼iPad縦置き

    ▼iPad横置き

    1
    いいねをした人:
    #118881
    アバター画像キタジマ タカシ
    参加者
    2371

    ズレるのはiPhoneとiPadで見るとズレています。

    iOS のバージョンと、iPhone、iPad のバージョン(14 Pro とか Air とか)をおしえてください!

    1
    いいねをした人:
    #118976
    アバター画像キタジマ タカシ
    参加者
    2371
    #118979
    TarCoon☆CarToon
    参加者
    56

    iOS のバージョンと、iPhone、iPad のバージョン(14 Pro とか Air とか)をおしえてください!

    iOS16.3.1
    iPhone14Pro、iPadPro(11インチ)(第2世代)です。

    あ、ちなみにこのサイトのタブ(ライン)ブロックもずれていますでしょうか…?

    iPad Proだとズレていませんでしたが、iPhone14Pro で確認しますとズレていますね。

    1
    いいねをした人:
    #118987
    es:エス
    参加者
    136

    横からお邪魔します。
    iPhoneとiPadで確認したところ、いずれもsafariでは問題なく表示されましたが、Chrome、Firefox、EdgeではTarCoon☆CarToonさんのご指摘の状態になりました。
    参考になりましたら幸いです。

    1
    いいねをした人:
    #118990
    アバター画像キタジマ タカシ
    参加者
    2371

    なるほど!確認してみます!

    1
    いいねをした人:
    #119001
    TarCoon☆CarToon
    参加者
    56

    あ、ちなみにこのサイトのタブ(ライン)ブロックもずれていますでしょうか…?

    iPad Proだとズレていませんでしたが、iPhone14Pro で確認しますとズレていますね。と報告させていただきましたが、

    • iPadOS 15.7.3
    • iPadAir2

    のiPadで表示すると、Safari、Chrome共にズレていますね。

    ▼iPad縦置き

    ▼iPad横置き

    1
    いいねをした人:
    #119014
    アバター画像キタジマ タカシ
    参加者
    2371

    情報ありがとうございます! iOS シミュレーター 15.5 + iPad Air で再現できました! 確認進めます。

    2
    いいねをした人:
    #119020
    アバター画像キタジマ タカシ
    参加者
    2371

    原因わかりました! iOS のバージョンによってはボタン要素にデフォルトで margin: 2px が付いちゃうみたいです。次のアップデートで修正入れます!

    2
    いいねをした人:
    #119212
    TarCoon☆CarToon
    参加者
    56

    ご対応ありがとうございました。
    確認できましたので、トピックを閉じさせていただきますね。
    またよろしくお願いします。

    1
    いいねをした人:
13件の投稿を表示中 - 1 - 13件目 (全13件中)
  • トピック「タブブロックのPCブラウザとスマホの見た目の違いについて。スマホでは文字の色が青色になっている。」には新しい返信をつけることはできません。

ドキュメント

Snow Monkey の設定方法やマニュアルを掲載しています。

ドキュメント

フォーラム

Snow Monkey の使い方やカスタマイズについてのご質問・ご要望等はサポートフォーラムで行っています。サポートフォーラムは誰でも閲覧できますが、書き込みできるのは Snow Monkey 購入者のみとなります。

サポートフォーラム

よくあるご質問

Snow Monkey のサービスについて不明な点がある場合は、まずはよくあるご質問をご確認ください。

よくあるご質問

お問い合わせ

よくあるご質問を見ても解決しなかった場合、試用版の申請については問い合わせフォームからお願いいたします。

お問い合わせ

Snow Monkey は Gutenberg ブロックエディターに対応した 100%GPL の WordPress テーマです。拡張性を意識した開発をおこなっており、カスタマイザーとブロックでスピーディーにサイトを立ち上げるだけでなく、CSS やフックを駆使した高度なカスタマイズにも柔軟に対応できます。