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，只需使用最小宽度或最小高度。不要使用“设备”。那就是让你兴奋起来。设备查询不检测方向更改。