メディアクエリとブートストラップモーダル？

Question

私はモーダルを作成していると私はすべてのデバイスでよく見ることができるようにしたいが、現在、私は以下のメディアクエリをしようとしていますし、それがすべてのデバイス（MBP、iPhone 6、24インチのデスクトップ）に

.modal-wide{ 
    width: 60%; 
    max-height: 90vh; 
    /*height: auto;*/ 
} 

/* For mobile phones: */ 
@media only screen and (min-width: 480px) { 
    .modal-body { 
    position: relative; 
     max-height: 200px; 
     overflow-y: auto; 
    } 
    .modal-wide { 
    width: 95%; 
    } 
} 

を変更

私の考えは、それは私のiPhoneでのみ変更されるだろうか？しかしこれはそうではありませんか？私は何か間違ったことをした？ .modal-wideセレクターのスタイリングが乱されています。

Answer 1

これは間違った方向にあるようです。 min-width: 480pxは、480pxまたはの画面幅を持つすべての端末をにターゲティングします。お望みの小型デバイスの場合max-width：

@media only screen and (max-width: 480px) { 
    ... 
}