kindle fire @media

Question

고유의 Kindle Fire 이메일 클라이언트에서 고유하게 렌더링되는 이메일을 디자인하려고합니다.

<div class="mobile" id="kindle" style="display:none">Kindle Fire</div> 
<div id="desktop">This is the desktop view</div> 

문제는 내가 풍경에 장치를 회전 할 때, 미디어 쿼리가 손실된다는 점이다 ...

@media only screen and (min-device-width: 590px) and (max-device-width:1014px){ 
/*kindle*/ 
    #desktop { display:none} 
    #kindle { display:block !important} 
}       

: 나는 다음과 같은 미디어 쿼리를 사용하여 초기 가로보기에 픽업 수 있어요 , 내가 그것을 다시 돌릴 때 그것은 아직도 길을 잃는다. 오리엔테이션 조건문을 사용하여 시도했지만 전혀 작동하지 않는 것 같습니다. 누구든지 어떤 제안이 있습니까?

Answer 1

내 모습이 가로보기에는 효과가있는 것처럼 보이지만 다른 태블릿 기기와 비교해 보지 않았습니다.

/** Kindle Fire Landscape **/ 
@media only screen and (min-device-width : 600px) and (max-device-width: 1280px) { 

} 

Answer 2

오리엔테이션 기반 CSS는 최소 너비 또는 최소 높이를 사용합니다. "장치"는 사용하지 마십시오. 그게 너를 괴롭히는거야. 장치 쿼리가 방향 변경을 감지하지 못합니다.