2016-03-30 6 views
0

私は2列の応答メールで作業しています。私のTDの1つにモバイルで削除するための適切な境界線を取得できないことを除いて、すべてが完璧に表示されています。私は以下のスタイルを設定しています:レスポンシブルメール - ボーダーは削除されません

td.copy { padding-right: 0px; border-bottom: 0; border-right: none; padding-bottom: 20px; } 

奇妙なことに、下の境界線はうまく追加されています。

ここに私のコードです。どんな助けでも大歓迎です。私はこれを理解することはできません。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title></title> 
<style type="text/css"> 

      body { margin: 0px; padding: 0px; } 

      @media only screen and (max-width: 660px) { 
       table.view { width: 480px !important; } 
       table.container { width: 480px !important; } 
       table.left { width: 260px !important; } 
       table.right { width: 140px !important; } 
       td.design img { display: none; } 
       td.design { background: #FFF url(http://www3.poscorp.com/emarketing/market-growth/free-design-25-off-sm.gif) no-repeat; 
        height: 75px; 
        background-repeat: no-repeat !important; 
        background-position: center !important; 
        } 
       td.contact table { width: 100% !important; text-align: center;} 
       table.info p { text-align:center;} 
       table.copy { width: 480px !important; } 
      } 

      @media only screen and (max-width: 510px) { 
       table.view { width: 100% !important; } 
       table.container { width: 100% !important; } 
       table.left { width: 100% !important; margin-bottom: 10px; } 
       td.copy { padding-right: 0px; border-bottom: 0; border-right: none; padding-bottom: 20px; } 
       table.right { width: 100% !important; } 
       table.video td { padding-top: 15px; } 
       td.design img { display: none; } 
       td.design { background: #FFF url(http://www3.poscorp.com/emarketing/market-growth/free-design-25-off.gif) no-repeat; 
        height: 88px; 
        background-repeat: no-repeat !important; 
        background-position: center !important; 
        vertical-align: middle; 
        text-align: center; } 
       table.copy { width: 100% !important; } 

      } 
</style>   

</head> 


<body> 
<table width="100%" border="0" cellspacing="0" cellpadding="0"> 
    <tr> 
    <td> 
    <table width="600" border="0" align="center" cellpadding="0" cellspacing="0" class="view"> 
    <tr> 
    <td align="right" valign="middle" style="font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 10px; line-height:100%; color: #666; background: #FFF; padding: 8px 10px 8px 10px; vertical-align:middle;"><a href="%%addthis_url_email%%"><img src="http://www2.poscorp.com/images/addthis/16x16/email.png" alt="Forward Email" width="13" height="13" style="vertical-align: sub;"></a>&nbsp;<a href="%%addthis_url_email%%" target="_blank" style="color: #666;">Forward to a Friend</a>&nbsp;&nbsp;|&nbsp;&nbsp;Email not displaying correctly? <a href="%%view_online%%" target="_blank" style="color: #666;">View it in your browser</a>.</td> 
    </tr> 
</table> 
    <table class="container" align="center" width="600" border="0" cellspacing="0" cellpadding="20" bgcolor="#FFFFFF" style="border:1px solid #CCC;"> 
     <tr> 
     <td class="header" bgcolor="#ffffff" style="border-top: #00a160 solid 10px; padding: 20px 60px 20px 20px; font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 27px; line-height:140%; color: #00a160; background: #FFF; ">When communicating with your patients, <span style="font-weight:bold;">consistency counts.</span></td> 
     </tr> 
     <tr> 
     <td class="content" bgcolor="#ffffff" style="font-family: Tahoma,Arial, Helvetica, sans-serif; font-size: 13px; line-height:130%; color: #333; background: #FFF; padding: 0px 20px 20px 20px;"> 
     <table width="340" border="0" cellspacing="0" cellpadding="0" align="left" class="left" > 
    <tr> 
    <td class="copy" style="font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 13px; line-height:130%; color: #333; background: #FFF; border-right: solid #00a160 1px; padding-right:20px;"><p style="margin-bottom: 15px; margin-top: 0px; padding-top: 0px; ">POS provides practices customized print and digital communication to ensure your brand stands out &#8211; and that it stays consistent from one communication solution to the next. From print and messaging to billing and surveying, our services help you deliver communications in the patient’s preferred way, increase practice revenue and improve patient satisfaction.</p> 
     <p style="margin-bottom: 15px; margin-top: 0px; padding-top: 0px; ">It's how you'll build loyalty while helping keep your patients healthy.</p> 
     <p style="margin-bottom: 15px; margin-top: 15px;"><a href="http://www.poscorp.com/products/print/" target="_blank" style="font-weight:bold; color:#00a160; text-decoration:none;">Print</a> &#8211; With print services from POS, you’ll receive clarity, convenience and consistency – from your practice stationery to marketing materials.</p> 
     <p style="margin-bottom: 15px; margin-top: 15px;"><a href="http://www.poscorp.com/products/statement-processing/" target="_blank" style="font-weight:bold; color:#00a160; text-decoration:none;">Statement Processing &amp; Patient Payment Services</a> &#8211; POS provides solutions to improve your practice's profitability. We specialize in driving down the cost of collecting your patient-owed balances through our Statement Processing, Online Bill Pay and Past Due Notification solutions.</p> 
     <p style="margin-bottom: 15px; margin-top: 15px;"><a href="http://www.poscorp.com/products/digital-messaging/" target="_blank" style="font-weight:bold; color:#00a160; text-decoration:none;">Digital Messaging</a> &#8211; Our automated communication system, POS Messaging&#8482;, lets you send customized, two-way communication to your patients via email, phone, text or mail to help you reduce no-shows and more.</p> 
     <p style="margin-bottom: 0px; margin-top: 15px;"><a href="http://www.poscorp.com/products/patient-surveys/" target="_blank" style="font-weight:bold; color:#00a160; text-decoration:none;">Patient Surveys</a> &#8211; With POS Surveys&#8482;, you can find out what your patients like about your practice and what you can improve so they don’t leave.</p></td> 
    </tr> 
</table> 
<table width="200" border="0" cellspacing="0" cellpadding="0" align="right" class="right" > 
    <tr> 
    <td> 
     <table width="100%" border="0" cellspacing="0" cellpadding="0" class="video"> 
      <tr> 
      <td style="font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 14px; line-height:130%; color: #333; background: #FFF; border-bottom: 1px #00a160 solid;"><p style="margin-top:0px; margin-bottom: 15px; text-align:center;"><a href="http://www.poscorp.com/blog/" target="_blank"><img src="http://www3.poscorp.com/emarketing/market-growth/blog-logo.gif" alt="POS Blog - Communicate" width="150" height="69"></a></p> 
      <p style="margin-top:0px; margin-bottom: 10px;">The blog for best practices in patient communication.</p> 
      <p style="margin-top:0px; margin-bottom: 20px;"><a href="http://www.poscorp.com/blog/" target="_blank" style="color: #00a160; text-decoration:underline;">JOIN NOW</a></p></td> 
      </tr> 
     </table> 

    <table width="100%" border="0" cellspacing="0" cellpadding="0" class="promo"> 
     <tr> 
     <td align="center" valign="middle" class="design"><p style="text-align:center; vertical-align:middle;" ><img src="http://www3.poscorp.com/emarketing/market-growth/free-design-25-off.gif" width="200" height="88" alt="Free Design and 25% a new print item"></p></td> 
     </tr> 
    </table> 



      </td> 
     </tr> 
    </table> 


     </td> 
     </tr> 
     <tr> 
     <td class="content" bgcolor="#ffffff" style="font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 13px; line-height:130%; color: #333; background: #FFF; padding: 10px 20px 20px 20px;"><p style="margin: 0px; ">For more information, contact your Regional Territory Manager, <span style="font-weight:bold;">%%user_name%%</span> at <span style="font-weight:bold;">%%user_phone%%</span> or <span style="font-weight:bold;"><a href="mailto:%%user_email%%" target="_blank" style="color:#333;">%%user_email%%</a></span>.</p></td> 
     </tr> 
     <tr> 
     <td class="content" bgcolor="#ffffff" style="font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 14px; line-height:130%; color: #333; background: #FFF; padding: 0px 20px 0px 20px; text-align:center;"> 
     <table width="100%" border="0" cellspacing="0" cellpadding="0"> 
    <tr> 
    <td align="center"><p style="font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 13px; line-height:130%; color: #333; background: #FFF; padding: 5px 0px 5px 0px; border-top: #CCC solid 1px; border-bottom:#CCC solid 1px; text-align:center; letter-spacing: 1px;"><a href="http://www.poscorp.com/products/print/" target="_blank" style="color:#333; text-decoration:none;">PRINT</a>&nbsp;<span style="color:#00a160;">|</span>&nbsp;<a href="http://www.poscorp.com/products/statement-processing/" target="_blank" style="color:#333; text-decoration:none;">STATEMENT PROCESSING</a>&nbsp;<span style="color:#00a160;">|</span>&nbsp;<a href="http://www.poscorp.com/products/digital-messaging/" target="_blank" style="color:#333; text-decoration:none;">DIGITAL MESSAGING</a>&nbsp;<span style="color:#00a160;">|</span>&nbsp;<a href="http://www.poscorp.com/products/patient-surveys/" target="_blank" style="color:#333; text-decoration:none;">PATIENT SURVEYS</a></p></td> 
    </tr> 
</table> 

     </td> 
     </tr> 

     <tr> 
     <td align="center" valign="top" class="contact" style="font-family: Arial, sans-serif; font-size: 14px; line-height:115%; color: #333; background: #FFF; padding: 20px 20px 20px 20px;"> 
      <table width="275" border="0" cellspacing="0" cellpadding="0" align="left" class="logo"> 
       <tr> 
       <td class="poslogo"><a href="http://www.poscorp.com" target="_blank"><img src="http://www3.poscorp.com/emarketing/master/pos_logo_hc.gif" alt="POS Professional Office Services, Inc." width="272" height="45"></a></td> 
       </tr> 
      </table> 
      <table width="265" border="0" cellspacing="0" cellpadding="0" align="right" class="info"> 
       <tr> 
       <td align="right"><p style="font-family: Tahoma, Arial, sans-serif; font-size: 13px; line-height: 100%; color: #333; font-weight:bold; margin:19px 0px 5px 0px;">800.331.4976&nbsp;<span style="color:#00a160;">|</span>&nbsp;<a href="http://www.poscorp.com" target="_blank" style="font-weight: bold; color: #333; text-decoration: none;">poscorp.com</a>&nbsp;<span style="color:#00a160;">|</span>&nbsp;<a href="http://www.linkedin.com/company/professional-office-services" target="_blank"><img src="http://www3.poscorp.com/emarketing/master/linkedin.jpg" alt="LinkedIn" width="16" height="16" border="0" style="vertical-align:bottom;"/></a>&nbsp;<a href="https://www.youtube.com/user/poscorp/" target="_blank"><img src="http://www3.poscorp.com/emarketing/master/youtube.jpg" width="39" height="16" alt="YouTube" border="0" style="vertical-align:bottom;"></a></p></td> 
       </tr> 
      </table> 


     </td> 
     </tr> 
    </table> 
<table width="600" border="0" align="center" cellpadding="0" cellspacing="0" class="copy"> 
    <tr> 
    <td bgcolor="#ffffff" style="font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 10px; line-height:120%; color: #666; background: #FFF; padding: 10px 10px 10px 10px; border-top:1px solid #CCC;"> 
       <p style="margin-top: 0px; margin-bottom:10px;"><span style="font-weight:bold;">Our mailing address is:</span> <br> 
        %%account_address%%</p> 
      <p style="margin-top: 10px; margin-bottom:0px;"><a href="%%email_preference_center%%" target="_blank" style="color: #666; font-weight: normal; text-decoration: underline;">update subscription preferences</a></p></td> 
    </tr> 
</table> 
    </td> 
    </tr> 
</table>  
</body> 
</html> 
+0

最初に述べたコードの修正。私はそれがうまくいくかどうかを確認するために「0」を入れようとしました。私は動作しませんでしたが、ここで正しいコードです。 td.copy {padding-right:0px; border-bottom:#00a160 1px solid; border-right:0;パディングボトム:20px; } – Kristen

答えて

0

メディアクエリに追加しましたか?重要ではありません!重要です。

+0

それはそれをしました!私はそれを忘れたとは信じられません。私はそれが何か単純なものになることを知っていた。どうもありがとうございます。これは私を狂って運転していた! – Kristen

+0

ねえ、うまくいきました。あなたは私にアップフォートを投げてもいいですか?ありがとう。 –

+0

私はやった。何らかの理由でそれはまだ表示されていませんが、うまくいけばそれはすぐになります。再度、感謝します。 – Kristen

関連する問題