幅780以下のCSSの適用

[マサキ]

テキストウィジェットに設置した

についてオリジナルスタイルシート設定でCSSを書いたのですが、ブラウザの幅780以下とモバイルテーマにおいて、CSSが適用されません。

PCとモバイルテーマで分けて任意のCSSを反映させる方法

上のページを参考に.mb-themeをつけてみたのですが、うまくいきませんでした。
COLORではモバイル用のCSSにはなにをつければいいのでしょうか。

Follow Me!!という名前のウィジェットです。
サイト: http://spotnote.jp

添付ファイル:

添付ファイルを開くにはログインしてください。

[DigiPress サポート]

テーマには直接関係ありませんので詳細のサポートは致しかねますが、780px以下であれば

@media only screen and (min-width: 780px)

ではなく

@media only screen and (max-width: 780px)

とすべきではないでしょうか。

なお、タブレット端末ではモバイルテーマではなくレスポンシブ(PCテーマ)表示です。

[マサキ]

文字が抜けてしまいました。「テキストウィジェットに設置したfollow-btn-spというクラスに〜」

クラスのCSSを設定すると横幅780以上には適用しますが、それ以下には適用しません。
一気に幅、モバイル関係なしに設定する方法はないのでしょうか？

[DigiPress サポート]

繰り返しますが、「〜px以下」に適用するのであれば max-width としてください。

なお、本件はメディアクエリに関することですのでこれ以上のサポートはご容赦ください。

[DigiPress サポート]

「適用しない」という詳細がわかりませんが、min-width のメディアクエリは不要であり、max-width で既定のCSSを「適用しない」ようなCSSを定義する、ということです。

[マサキ]

ありがとうございます！

[投稿者]

投稿