kindle fire @media

Question

我正試圖設計一個在原生Kindle Fire電子郵件客戶端中呈現唯一的電子郵件。我能夠使用以下媒體查詢的初始水平視圖皮卡：

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

...

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

的問題是，當我旋轉裝置景觀，媒體查詢丟失，當我旋轉它時，它仍然丟失。我曾嘗試使用方向性條件語句，但似乎根本不起作用。任何人有任何建議？

Answer 1

這似乎適用於我的橫向視圖，但我沒有檢查它與其他平板設備。

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

} 

Answer 2

對於基於方向的CSS，只需使用最小寬度或最小高度。不要使用「設備」。那就是讓你興奮起來。設備查詢不檢測方向更改。