W3QはBiztterに生まれ変わりました!
Web制作に関するお悩みはBiztterへどうぞ!

Biztterで質問する

ID:dbYvoj さんの質問

メディアクエリについてです。

cssにて、メディアクエリを設定するも、上に記述したものが読み込まれません。
とある要素について
@media (min-width: 991px) {...}
@media (min-width: 768px) {...}
@media (man-width: 767px) {...}
と記述すると、一番上に記述した内容だけ読み込まず、2番目のものから順次読み込みます。
試しに順番も入れ替えたのですが、同様の結果です。
一体何が原因なのでしょうか。
解決策、原因などおわかりでしたらご教授願いたく質問出せていただきます。

自分でできる範囲で調べたりしたのですが、具体的な解決策は見つかりませんでした。
記述の内容自体はミスはなく、それぞれ個別には機能しますが、全て一緒に組み込んだ時に1つだけ読み込まなくなります。

ちなみに、サイトはtumblrをカスタムしており、bootstrap3を導入しています。

どうぞよろしくお願い致します。

みんなの回答 4 件

ID:BmH/L2 さんの回答

minとmaxの意味考えようよ・・・

ID:F1bikj さんの回答

そう記述したらそうなって当たり前だし
あとman-widthになってるし

ID:7GdQ.6 さんの回答

man-widthでクソワロタwww
人間の幅ってデブさ加減かよwww

この程度の問題も調べてわからないようじゃ、質問しても呆れられるだけだぞ。
「media query 複数デバイス」等でググれ。

ID:Ihgih4 さんの回答

manはとりあえずスルーして。
0px~767px 三番目が反映
768px~990px 二番目が反映
991px~ 一番目と二番目が反映され、cssは後に記述したもの優先なので二番目が反映
普通に一番目は反映されて、その上で二番目に上書きされるね。

最終更新日:2017-01-04 (875 views)

関連するトピックス

ページ上部に戻る