NOVINKA! E-learningové kurzy umělé inteligence. Nyní AI za nejlepší ceny. Zjisti více:
NOVINKA – Víkendový online kurz Software tester, který tě posune dál. Zjisti, jak na to!
Avatar
rosina.jakub
Člen
Avatar
rosina.jakub:14.7.2017 13:14

Čaute, mám problém s newslettrom. Problém sa vyskytuje iba v Outlooku.

<body bgcolor="#e7eaf4" width="100%" style="margin: 0;" yahoo="yahoo">
    <table bgcolor="#e7eaf4" cellpadding="0" cellspacing="0" border="0" height="100%" width="100%" style="border-collapse:collapse;">
        <tr>
            <td>
                <center style="width: 98%; margin: 0 auto;">
                    <div style="display:none;font-size:1px;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;mso-hide:all;"> HyperSlevy Newsletter </div>
                    <table align="center" width="600" class="email-container">
                        <tr>
                            <td style="padding: 20px 0; text-align: center">
                                <a href="http://www.hyperslevy.cz/#"><img src="logo.png" width="150" height="70" alt="logo" border="0"></a>
                            </td>
                        </tr>
                    </table>
                    <table cellspacing="0" cellpadding="0" border="0" align="center" width="610" class="email-container">
                        <tr>
                            <td style="padding: 35px 0 30px; font-family: 'Roboto', sans-serif; text-align: left; font-size: 20px; mso-height-rule: exactly; line-height: 20px; color: #888888;"> Milá Veroniko,
                                <br>vyberte si z našich nových slev tu pravou a ušetřete: </td>
                        </tr>
                        <tr>
                            <td style="padding-bottom: 20px;">
                                <table cellspacing="0" cellpadding="0" border="0" width="100%" height="50">
                                    <tr>
                                        <td align="left" valign="bottom" width="100%" height="280" style="background:url(sleva1.png);background-repeat: no-repeat">
                                            <table align="left" border="0" cellpadding="0" cellspacing="0" width="120" height="50" style="background-color:rgba(240,24,24,0.9);max-width: 560px;">
                                                <tr>
                                                    <td height="50" valign="bottom" style="vertical-align:bottom;padding:0 25px;text-align: left; font-family: 'Roboto', sans-serif; font-size: 24px; mso-height-rule: exactly; color: #ffffff;line-height: 50px; font-weight: 900;">-73%</td>
                                                </tr>
                                            </table>
                                        </td>
                                        <td width="50" valign="top">
                                            <table valign="top" cellspacing="0" cellpadding="0" border="0">
                                                <tr>
                                                    <td style="font-size: 15px; mso-height-rule: exactly; line-height: 20px; color: #555555;text-align: left;"><img src="sleva1-hviezdicky.png"></td>
                                                </tr>
                                                <tr>
                                                    <td style="font-family: 'Roboto', sans-serif; font-size: 18px; mso-height-rule: exactly; color: #ff8208; text-align: left;font-weight: bold"> 4.7 </td>
                                                </tr>
                                            </table>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td align="left" valign="top" width="100%" bgcolor="white">
                                            <table align="left" border="0" cellpadding="0" cellspacing="0">
                                                <tr>
                                                    <td valign="top" style="padding:25px 30px;text-align: left; font-family: 'Roboto', sans-serif; font-size: 18px; mso-height-rule: exactly; color: #333;">Permanentka na 15 či 30 vstupů na kruhový trénink a cvičení Slim Belly ve fitness pro ženy na Praze 9</td>
                                                </tr>
                                            </table>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td align="left " valign="top " width="100% " bgcolor="white" style="padding: 0px 25px 20px;">
                                            <table align="left" border="0" cellpadding="0" cellspacing="0">
                                                <tr>
                                                    <td align="left" width="20%" style="max-width: 100px;font-size: 24px;padding-right: 20px;color: #0b246c;font-weight: 900;">599 Kč</td>
                                                    <td align="left" width="46%" style="max-width: 100px;font-size: 24px;color: #c2c8da;text-decoration: line-through; ">2 250 Kč</td>
                                                    <td align="right" width="33%" style="background:#f01818;padding:10px 25px;"><a href="http://www.hyperslevy.cz/praha/165696-permanentka-na-kruhovy-trenink-v-praze/" style="color:#fff;font-weight: 700;text-decoration: none;border-radius: 4px; ">PROHLÉDNOUT</a></td>
                                                </tr>
                                            </table>
                                        </td>
                                    </tr>
                                    <tr>
                                                    <td align="center" style="padding: 50px 0;">
                                                        <a href="http://www.hyperslevy.cz/" style="color:#fff;font-weight: 700;text-decoration: none;max-width: 203px;background:#f01818;border-radius: 4px;padding:20px 35px;">ZOBRAZIT VŠECHNY SLEVY</a>
                                                    </td>
                                                </tr>
                                </table>
                            </td>
                        </tr>
                        <tr>
                            <td align="left" valign="middle" width="100%" style="padding: 40px 25px 20px; border-top: 1px solid #c2c8da;">
                                <h2 style="text-align: center;color:#0b246c;font-size: 26px;font-weight: bold;font-style: italic;font-family: 'Trebuchet MS',sans-serif;margin:0 0 0px;">Jsme tu pro vás</h2> </td>
                        </tr>
                        <tr>
                            <td align="center" style="padding-top: 20px;">
                                <table width="100%" align="center">
                                    <tbody>
                                        <tr>
                                            <td align="center" valign="top" style="border-right: 1px dotted #8994b4;"> <img src="phone.png">
                                                <p style="margin:10px 0 0;line-height:24px;color:#333;font-size: 16px;">Zavolejte nám</p>
                                                <p style="margin:0;"><a href="tel:+420 296 210 012" style="line-height:24px;color:#333;font-size: 16px;font-weight: bold;text-decoration: none;">+420 296 210 012</a></p>
                                                <p style="margin:0;line-height:24px;color:#333;font-size: 16px;">Po-Pá:8:00-18:00</p>
                                            </td>
                                            <td align="center" valign="top" style="border-right: 1px dotted #8994b4;"> <img src="envelope.png">
                                                <p style="margin:10px 0 0;line-height:24px;color:#333;font-size: 16px;">Napište nám e-mail</p>
                                                <p style="margin:0;"><a href="meilto:[email protected]" style="line-height:24px;color:#0b246c;font-size: 16px;font-weight: bold;text-decoration: none;">[email protected]</a></p>
                                            </td>
                                            <td align="center" valign="top"> <img src="facebook.png">
                                                <p style="margin:10px 0 0;line-height:24px;color:#333;font-size: 16px;">Facebook
                                                    <br>sledujte nás</p>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td height="50"> </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </td>
                        </tr>
                        <tr>
                            <td align="center" style=" border-top: 1px solid #c2c8da;padding: 40px 25px 0px;">
                                <h2 style="color:#0b246c;font-size: 26px;font-weight: bold;font-style: italic;font-family: 'Trebuchet MS',sans-serif;margin:0;">Chcete si upravit obsah newsletteru?</h2> </td>
                        </tr>
                        <tr>
                            <td align="center">
                                <table width="100%" align="center" style="border-bottom: 1px solid #c2c8da;">
                                    <tbody>
                                        <tr>
                                            <td align="center">
                                                <p style="margin:10px 0 0;line-height:24px;color:#333;font-size: 16px;">Nastavte si ve svém účtu, jaké nabídky vás zajímají a chcete je dostávat do e-mailu.</p>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td align="center" style="padding-top: 20px;">
                                                <p style="margin:0;padding:10px 25px"><a href="http://www.hyperslevy.cz/" style="font-size:16px;color:#fff;background:#ff8208;padding:10px 25px;font-weight: 700;text-decoration: none;border-radius: 4px;max-width: 235px">NASTAVIT NEWSLETTER</a></p>
                                            </td>
                                        </tr>
                                        <td height="30"> </td>
                                    </tbody>
                                </table>
                            </td>
                        </tr>
                    </table>
                </center>
            </td>
        </tr>
    </table>
</body>

Prvá chyba sa vyskytuje iba v Outlooku 2013. Ide o to, že mi nefunguje valign="bottom" pri tom texte "-73%".
Ďalšia chyba a tá je už vo všetkých verziách je to, že pri buttonoch "Nastavit newsletter" a "Zobrazit všechny slevy mi nejde nastaviť padding.
Poradí mi s tým niekto?

 
Odpovědět
14.7.2017 13:14
Avatar
Lako
Člen
Avatar
Lako:15.7.2017 21:21

A to jak to vypadá tady: https://jsfiddle.net/LL53jwos/ je v poho?
Přidejte obrázky toho co to dělá v těch outloocích.

 
Nahoru Odpovědět
15.7.2017 21:21
Avatar
rosina.jakub
Člen
Avatar
rosina.jakub:16.7.2017 11:56

V prehliadači je to v poriadku. V outlooku je to ako na obrázku

 
Nahoru Odpovědět
16.7.2017 11:56
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 3 zpráv z 3.