iPhone 6 Plus（ランドスケープ）のメディアクエリと重複するiPhone 4/4S（ランドスケープ）のメディアクエリ

Question

iPhone 6 plusのメディアクエリを設定すると、ランドスケープの向きではうまく描画されますが、 iPhone 4Sのコントロール。これを避けるにはどうすればよいですか？私はこれがブートストラップの.wellを上書きするように設定したパディングのためだと知っていますが、設定しないと、コントロール内に不必要なスペースがたくさんあります。あなたがこれを追加しました

/iPhone 4と4S風景/

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) 
and (orientation : landscape) { 

h1, .h1{ 
    font-size:26px; 
} 


.well{ 
    padding: 59px; 
} 
} 

/iPhone 6 Plusの風景の中に/

@media only screen 
and (min-device-width : 414px) 
and (max-device-width : 736px) 
and (orientation : landscape) { 

.mt-4x{ 
    margin-top:20px !important; 
} 

.well{ 
    padding: 175px; 
} 
} 

Answer 1

：ここ

は私のCSSコードでありますあなたのiPhoneのためのあなたのCSSのメディアクエリに？

/* iPhone 6 in portrait & landscape */ 
 
@media only screen 
 
and (min-device-width : 375px) 
 
and (max-device-width : 667px) { 
 
    
 
} 
 

 
/* iPhone 6 in landscape */ 
 
@media only screen 
 
and (min-device-width : 375px) 
 
and (max-device-width : 667px) 
 
and (orientation : landscape) { 
 
    
 
} 
 

 
/* iPhone 6 in portrait */ 
 
@media only screen 
 
and (min-device-width : 375px) 
 
and (max-device-width : 667px) 
 
and (orientation : portrait) { 
 
    
 
} 
 

 
/* iPhone 6 Plus in portrait & landscape */ 
 
@media only screen 
 
and (min-device-width : 414px) 
 
and (max-device-width : 736px) { 
 
    
 
} 
 

 
/* iPhone 6 Plus in landscape */ 
 
@media only screen 
 
and (min-device-width : 414px) 
 
and (max-device-width : 736px) 
 
and (orientation : landscape) { 
 
    
 
} 
 

 
/* iPhone 6 Plus in portrait */ 
 
@media only screen 
 
and (min-device-width : 414px) 
 
and (max-device-width : 736px) 
 
and (orientation : portrait) { 
 
    
 
} 
 

 
/* iPhone 5 & 5S in portrait & landscape */ 
 
@media only screen 
 
and (min-device-width : 320px) 
 
and (max-device-width : 568px) { 
 
    
 
} 
 

 
/* iPhone 5 & 5S in landscape */ 
 
@media only screen 
 
and (min-device-width : 320px) 
 
and (max-device-width : 568px) 
 
and (orientation : landscape) { 
 
    
 
} 
 

 
/* iPhone 5 & 5S in portrait */ 
 
@media only screen 
 
and (min-device-width : 320px) 
 
and (max-device-width : 568px) 
 
and (orientation : portrait) { 
 
    
 
} 
 

 
/* 
 
    iPhone 2G, 3G, 4, 4S Media Queries 
 
    It's noteworthy that these media queries are also the same for iPod Touch generations 1-4. 
 
*/ 
 

 
/* iPhone 2G-4S in portrait & landscape */ 
 
@media only screen 
 
and (min-device-width : 320px) 
 
and (max-device-width : 480px) { 
 
    
 
} 
 

 
/* iPhone 2G-4S in landscape */ 
 
@media only screen 
 
and (min-device-width : 320px) 
 
and (max-device-width : 480px) 
 
and (orientation : landscape) { 
 
    
 
} 
 

 
/* iPhone 2G-4S in portrait */ 
 
@media only screen 
 
and (min-device-width : 320px) 
 
and (max-device-width : 480px) 
 
and (orientation : portrait) { 
 
    
 
}