2016-12-09 2 views
0

3 elements responsiveGmail 애플리케이션 3 요소

안녕 모두,

내가 3 개 요소에 문제가 자신의 최신 업데이트 Gmail 애플리케이션에 일반적으로 반응해야한다. 더 이상 디스플레이를 사용할 수 없습니다. 정적 또는 정상적으로 반응하도록 만드는 방법은 무엇입니까?

<style> 
@media only screen and (max-width : 480px){ 
     .paddingTop10{ 
      padding-top:10px !important; 
     } 
@media only screen and (max-width : 480px){ 
     .fullWidthImg img{ 
      width:100% !important; 
      height:auto; 
     } 
@media only screen and (max-width : 480px){ 
     .fullWidth{ 
      width:100% !important; 
      height:auto; 
     } 
</style> 

<table width="100%" cellpadding="0" cellspacing="0" border="0"> 
       <tr> 
       <td> 
        <table class="fullWidth" align="left" width="440" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;"> 
        <tr> 
         <td> 
         <table class="fullWidth" align="left" width="196" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;"> 
          <tr> 
          <td class="paddingTop10 mobileHide fullWidthImg"> 
           <a href="http://flowerbeauty.com/holiday-kits/detail/82/flower-eyem-ready-collection/?&amp;utm_source=camonitor&amp;utm_medium=email&amp;utm_campaign=giftguide"> 
           <img src="https://gallery.mailchimp.com/93236a445e119a73252cba6e4/images/851f9965-7d09-41a8-b298-4069b24371aa.png" width="196" alt="" border="0" style="display:block;"> 
           </a> 
          </td> 
          <!--[if !mso 9]><!--> 
          <td style="display: none;" class="fullWidthImg fullHide mobileShow"> 
           <a href="http://flowerbeauty.com/?utm_source=camonitor&amp;utm_medium=email&amp;utm_campaign=giftguide"> 
           <img src="https://gallery.mailchimp.com/93236a445e119a73252cba6e4/images/7b28fcdd-e9f7-4f06-93ab-ca129601423f.png" alt="Shop Now" title="Shop Now" width="195" style="max-height:0; width: 0; display:block; border-spacing:0;"> 
           </a> 
          </td> 
          <!--<![endif]--> 
          </tr> 
         </table> 
         <!--[if (gte mso 9)|(IE)]> 
         </td> 
         <td valign="top" style="border-top:1px solid #dcddde;border-bottom:1px solid #dcddde;"> 
         <![endif]--> 
         <table class="fullWidth" align="right" width="244" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;"> 
          <tr> 
          <td class="paddingTop10 fullWidthImg"> 
           <a href="http://flowerbeauty.com/eyes/detail/72/flower-endless-wear-eye-color-ultimate-eye-color/?utm_source=camonitor&amp;utm_medium=email&amp;utm_campaign=giftguide"> 
           <img src="https://gallery.mailchimp.com/93236a445e119a73252cba6e4/images/22cab22e-0182-45fd-b706-3d775d79f4d0.png" width="244" alt="" border="0" style="display:block;"> 
           </a> 
          </td> 
          </tr> 
         </table> 
         </td> 
        </tr> 
        </table> 
        <!--[if (gte mso 9)|(IE)]> 
       </td> 
       <td valign="top" style="border-top:1px solid #dcddde;border-bottom:1px solid #dcddde;"> 
        <![endif]--> 
        <table class="fullWidth" align="right" width="195" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;"> 
        <tr> 
         <td class="paddingTop10 fullWidthImg"> 
         <a href="http://flowerbeauty.com/holiday-kits/detail/84/flower-shadow-art-palette/?utm_source=camonitor&amp;utm_medium=email&amp;utm_campaign=giftguide"> 
          <img src="https://gallery.mailchimp.com/93236a445e119a73252cba6e4/images/f34f8189-facf-4d29-bd97-6c0bebb442a7.png" width="195" alt="" border="0" style="display:block;"> 
         </a> 
         </td> 
        </tr> 
        </table> 
       </td> 
       </tr> 
      </table> 
+0

먼저, 표시 : 아무 것도 gmail에서 작동하지 않아야합니다. 둘째, Gmail은 이제 미디어 쿼리를 지원하지만 구문에 대해서는 매우 까다 롭습니다. 최대 너비와 다음 사이에는 공백을 둘 수 없습니다. 구문 오류가 있으면 Gmail에서 모든 CSS를 무시합니다. 그 공간을 제거하면 (미국) Gmail에서 CSS를 사용할 수 있습니다. –

답변

0

당신은 Gmail의 숨겨진해야 할 요소를 처리하기위한 CSS의 조각을 시도 할 수 :

는 코드입니다. 당신은 바로 그 간단한 디스플레이입니다 : 아무도 작동하지 않습니다! 그것을 보여주기 위해 적절한 있다면

style="width:0; overflow:hidden;float:left; display:none"

는 모든 사람들을 되돌릴 상단에 미디어 쿼리에 CSS를 사용합니다.

+0

나는 gmail이 display with : none으로 수정했다고 말하고자한다. 더 이상 작동하지 않습니다. 그리고 이것은 나의 이메일을 반응 적으로 만드는 것이 나의 문제이다. – averty