スキン「ギンガムチェック」でプラグイン「Speech Bubble」に不具合

Simplicityの特徴 › フォーラム › テーマファイルのカスタマイズに関する質問など › スキン「ギンガムチェック」でプラグイン「Speech Bubble」に不具合

5件の返信スレッドを表示中
  • 投稿者
    投稿
    • #56809
      宮林 真
      ゲスト

      いつもお世話になっております。
      スキン「ギンガムチェック(爽やか)」でブログを作成中です。
      ウロキキは今日も楽々営業!

      プラグイン「Speech Bubble」を使用したところ、アイコンとネームが重なって表示されます。
      ウロキキからご挨拶
      「ギンガムチェック(シック)」でも同様の不具合が発生しますが、「ギンガムチェック(ガーリー)」では正しく表示されます。
      状況説明

      スマホでは何れも正しく表示されます。

      style.cssの不具合でしょうか?
      ご教示いただければ幸いです。

    • #56810
      かうたっく
      ゲスト
      .sb-type-fb > .sb-subtype-a > .sb-speaker > .sb-name {
          margin-top: 1.2em;
      }

      これをstyle.cssに追記したら思う通りになりました。

      ウロキキからご挨拶で試した結果です。原因は調べようとして、時間が遅いのでやめてしまってゴメンナサイです^^;

    • #56815
      アバター画像わいひら
      キーマスター

      サポート対象外のものにもあるように、全てのプラグインに対して動作確認はできません。
      ですので、プラグインとの競合により起こる不具合は、全て把握できるわけでは無いので、基本的にプラグインとの競合により起こる不具合は、自前で対応していただくしかないかもしれません。
      以下のように書いても、改善できるかもしれません。

      .sb-type-fb > .sb-subtype-a > .sb-speaker > .sb-icon, .sb-type-fb > .sb-subtype-b > .sb-speaker > .sb-icon, .sb-type-fb > .sb-subtype-c > .sb-speaker > .sb-icon, .sb-type-fb > .sb-subtype-d > .sb-speaker > .sb-icon {
          height: auto;
      }

      簡単に見てみたところ、ギンガムチェックが影響しているっぽいところは、ちょっと見つけられませんでした。

    • #56819
      宮林 真
      ゲスト

      かうたっくさん、わいひらさん。ご回答ありがとうございます。

      当方でもその後イロイロ調べてみました。

      gingham-cleanとgingham-girlishのstyle.cssを比較して以下の違いを発見しました。

      gingham-cleanにはgingham-girlishには存在しない以下の記述があります。

      style.cssの162行~168行
      ——ここから——
      #main .entry {
      margin-bottom: 4em;
      }

      .article img {
      margin-top: 1em;
      }
      ——ここまで——

      gingham-cleanのstyle.cssからこれらを削除してアップロードした結果、
      問題の症状は回避できました。

      (他の部分への影響が出ないか検証はしていません)

    • #56821
      かうたっく
      ゲスト
      .article img {
        margin-top: 1em;
      }
      .article .sb-type-fb img {
        margin-top: 0;
      }

      元のコードは上の部分です。上のコードを置いたままだと他に影響がないかもしれないので、該当画像がズレる部分sb-type-fbにある画像だけ、外側上部の余白をなしにしたらどうでしょうか。

      コチラで試すとキレイに反映されましたよ。sb-type-fbは#56809にある画像の『白い部分』アイコンと吹き出しを囲む領域です。

    • #56825
      アバター画像わいひら
      キーマスター

      なるほど、文字の方ばかり見ていましたが、画像の方に問題があったんですね。
      とりあえず、見た感じそのスタイリングにする必要性は見れないので、次のバージョンでは、該当部分を削除して修正したいと思います。
      原因まで教えていただいて、ありがとうございます!

5件の返信スレッドを表示中
  • フォーラム「テーマファイルのカスタマイズに関する質問など」には新規投稿および返信を追加できません。
スポンサーリンク
アドセンス(大)
アドセンス(大)