@media只有屏幕不能在手機上工作

我正在創建一個響應式電子郵件。在我的電子郵件模板，我已經包含了這個標籤：@media只有屏幕不能在手機上工作

<meta name="viewport" content="width=device-width, initial-scale=1.0">

和已經添加了這些造型屬性爲移動設備：

@media only screen and (max-device-width: 799px) { 

    div[class="column"] { 
      width: auto!important; 
      float:none!important; 
     } 
     .reasonDiv { 
      float:none!important; 
      padding-left: 12px!important; 
      padding-top: 35px!important; 
     } 
     .image { 
      width: 10px; 
      height: 10px; 
     } 
     .message { 
      padding-top: 10px!important; 
     } 
     .productImage { 
      width: 64px!important; 
      height: inherit!important; 
     } 
     .siteLogo { 
      width: 180px!important; 
     } 
    }

的樣式屬性沒有在移動設備上工作！請幫忙！謝謝。

來源

2013-12-24 Lilu Patel

您是如何測試的？您是否親自去移動設備上的網站？使用'max-device-width'意味着它只會影響物理設備。試試'max-width'，這樣你就可以在你的電腦上進行調試。 – agconti

我不知道確切的原因，但請注意，大多數電子郵件客戶端不支持媒體查詢，也可以使用最大寬度，而不是最大設備寬度，看看是否可行 –

是的，我我正在使用Mandrills測試電子郵件功能。 –

經過一番研究，我發現大多數電子郵件提供商不支持@media查詢標籤！

來源

2014-05-07 20:46:52

@media只有屏幕不能在手機上工作

回答

相關問題