Jump to content
Priscila Sena

Quebra HTML em certos navegadores

Recommended Posts

Boa noite, tudo bem?

Me chamo Priscila e estou com um pequeno problema.

Usamos um sistema que gera template de e-mail marketing aqui na empresa que eu trabalho e o disparo é feito por um sistema de disparo de e-mails, mudaram agora quem dispara e estamos com alguns problemas. As imagens ficam enormes em alguns navegadores (principalmente quando abrem pelo Outlook), o TI, que foi quem fez o template está batendo um pouco a cabeça para tentar resolver o problema para os próximos, o código eu acho que está mais ou menos e creio que o problema seja que ele não reconhece a tag style que puxa pelo td, mas não tenho certeza. 

Podem me ajudar para algumas melhorias para os próximos? Para evitar quebra?

Eu vou deixar o código aqui para vocês darem uma olhada, é o código de uma campanha mais antiga.

"

<!DOCTYPE html>
<html>
    <head>
        <meta name="generator" content="">
        <link href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,700,700i,900,900i" rel="stylesheet">
        <meta http-equiv="content-type" content="text/html; charset=utf-8">
    </head>
    <body style="font-family: 'Roboto', Myriad-pro, Arial, Helvetica, sans-serif;background-color: #eee;color: #666;">
                        <div class="container 1" style="width: 100%;max-width: 700px;min-width: 320px;margin: 0 auto;background-color: white;">
                        <table cellpadding="0" cellspacing="0" class="imgTopo" style="margin: 30px 0 10px;border-spacing: 0;width: 100%;max-width: 700px;height: auto;">
                <tr>
                    <td>
                        <a href="https://www.walmart.com.br/" target="_blank" style="text-decoration: none;"><img style="width: 100%;" src="https://template.casavaticano.com.br//templates/testeira_pais_emkt-walmart.png"></a>
                    </td>
                </tr>
            </table>
                        <table style="width: 100%;max-width: 700px;min-width: 320px;text-align: center;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
                <tbody>
                                        <tr>
                                                                                    <tr>
                                                               <td valign="bottom" align="centered">
                                                                        <table class="toda_categoria_a_com_x_de_desconto_na_compra_da_y_unidade" style="width: 210px;display: inline-block;margin: 0 auto 30px;border-spacing: 0;" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td><table style="margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td>
                <img class="imgBox" src="https://template.casavaticano.com.br//templates/6953202.jpeg" style="max-width: 200px;max-height:200px; top: 0px;vertical-align: top;">
            </td>
        </tr>
    </tbody>
</table>

                <table class="boxRed" style="margin: 0 auto;border-spacing: 0;width: 210px;background-color: #dd1a3a;border-radius: 10px;" cellspacing="0" cellpadding="0">
                    <tbody>
                        <tr>
                            <td>
                                <table class="boxYellow" style="margin: 4px auto 0px;border-spacing: 0;width: 200px;background-color: yellow;border-radius: 6px;padding: 0px;" cellspacing="0" cellpadding="0"><tbody><tr>
            <td><table style="width: 170px;margin: 0 auto;border-spacing: 0;"><tbody><tr>
            <td class="txtPorcDesc" style="text-transform: uppercase;color: #dd1a3a;font-weight: 700;font-size: 38px;">
                <table style="margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0"><tbody><tr><td>
                <span>50</span><span class="txtPorcSinal" style="text-transform: uppercase;color: #dd1a3a;font-weight: 900;font-size: 20px;">%</span>
                </td></tr></tbody></table>
            </td>
            <td class="txtDescUnid" style="text-transform: uppercase;color: black;font-weight: 900;font-size: 14px;line-height: 100%;position: relative;left: 5px;text-align: left;">
                <table style="width: 120px;text-align: left;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0"><tbody><tr><td>
                <span>de desconto </span><br><span>na 2ª unidade**</span>          
                </td></tr></tbody></table>
            </td>
            </tr></tbody></table></td>
        </tr></tbody></table>
        <table style="max-width: 95%;height: 50px;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
            <tbody>
                <tr>
                    <td class="txtBoxRed" style="text-transform: uppercase;color: white;font-weight: 400;font-size: 14px;">
                        <span>TODOS OS PAPÉIS HIGIÊNICOS</span>
                    </td>
                </tr>
            </tbody>
            </table>
                </td>
        </tr>
        </tbody>
        </table>
            </td>
        </tr>
    </tbody>
</table>

                                </td>
                                                                                                                                                <td valign="bottom" align="centered">
                                                                         <table class="toda_categoria_a_com_x_de_desconto_na_compra_da_y_unidade" style="width: 210px;display: inline-block;margin: 0 auto 30px;border-spacing: 0;" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td><table style="margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td>
                <img class="imgBox" src="https://template.casavaticano.com.br//templates/6722944.jpeg" style="max-width: 200px;max-height:200px; top: 0px;vertical-align: top;">
            </td>
        </tr>
    </tbody>
</table>

                <table class="boxRed" style="margin: 0 auto;border-spacing: 0;width: 210px;background-color: #dd1a3a;border-radius: 10px;" cellspacing="0" cellpadding="0">
                    <tbody>
                        <tr>
                            <td>
                                <table class="boxYellow" style="margin: 4px auto 0px;border-spacing: 0;width: 200px;background-color: yellow;border-radius: 6px;padding: 0px;" cellspacing="0" cellpadding="0"><tbody><tr>
            <td><table style="width: 170px;margin: 0 auto;border-spacing: 0;"><tbody><tr>
            <td class="txtPorcDesc" style="text-transform: uppercase;color: #dd1a3a;font-weight: 700;font-size: 38px;">
                <table style="margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0"><tbody><tr><td>
                <span>50</span><span class="txtPorcSinal" style="text-transform: uppercase;color: #dd1a3a;font-weight: 900;font-size: 20px;">%</span>
                </td></tr></tbody></table>
            </td>
            <td class="txtDescUnid" style="text-transform: uppercase;color: black;font-weight: 900;font-size: 14px;line-height: 100%;position: relative;left: 5px;text-align: left;">
                <table style="width: 120px;text-align: left;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0"><tbody><tr><td>
                <span>de desconto </span><br><span>na 2ª unidade**</span>          
                </td></tr></tbody></table>
            </td>
            </tr></tbody></table></td>
        </tr></tbody></table>
        <table style="max-width: 95%;height: 50px;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
            <tbody>
                <tr>
                    <td class="txtBoxRed" style="text-transform: uppercase;color: white;font-weight: 400;font-size: 14px;">
                        <span>TODOS AS FRALDAS HUGGIES</span>
                    </td>
                </tr>
            </tbody>
            </table>
                </td>
        </tr>
        </tbody>
        </table>
            </td>
        </tr>
    </tbody>
</table>

                                </td>
                                                                                                                                                <tr>
                                                                <td valign="bottom" align="centered">
                                                                        <table class="toda_categoria_a_com_x_de_desconto_na_compra_da_y_unidade" style="width: 210px;display: inline-block;margin: 0 auto 30px;border-spacing: 0;" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td><table style="margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td>
                <img class="imgBox" src="https://template.casavaticano.com.br//templates/8134526.jpeg" style="max-width: 200px;max-height:200px; top: 0px;vertical-align: top;">
            </td>
        </tr>
    </tbody>
</table>

                <table class="boxRed" style="margin: 0 auto;border-spacing: 0;width: 210px;background-color: #dd1a3a;border-radius: 10px;" cellspacing="0" cellpadding="0">
                    <tbody>
                        <tr>
                            <td>
                                <table class="boxYellow" style="margin: 4px auto 0px;border-spacing: 0;width: 200px;background-color: yellow;border-radius: 6px;padding: 0px;" cellspacing="0" cellpadding="0"><tbody><tr>
            <td><table style="width: 170px;margin: 0 auto;border-spacing: 0;"><tbody><tr>
            <td class="txtPorcDesc" style="text-transform: uppercase;color: #dd1a3a;font-weight: 700;font-size: 38px;">
                <table style="margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0"><tbody><tr><td>
                <span>60</span><span class="txtPorcSinal" style="text-transform: uppercase;color: #dd1a3a;font-weight: 900;font-size: 20px;">%</span>
                </td></tr></tbody></table>
            </td>
            <td class="txtDescUnid" style="text-transform: uppercase;color: black;font-weight: 900;font-size: 14px;line-height: 100%;position: relative;left: 5px;text-align: left;">
                <table style="width: 120px;text-align: left;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0"><tbody><tr><td>
                <span>de desconto </span><br><span>na 2ª unidade**</span>            
                </td></tr></tbody></table>
            </td>
            </tr></tbody></table></td>
        </tr></tbody></table>
        <table style="max-width: 95%;height: 50px;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
            <tbody>
                <tr>
                    <td class="txtBoxRed" style="text-transform: uppercase;color: white;font-weight: 400;font-size: 14px;">
                        <span>TODOS OS VINHOS OU ESPUMANTES</span>
                    </td>
                </tr>
            </tbody>
            </table>
                </td>
        </tr>
        </tbody>
        </table>
            </td>
        </tr>
    </tbody>
</table>

                                </td>
                                                                                                                                                <td valign="bottom" align="centered">
                                                                        <table class="simples" style="width: 210px;display: inline-block;margin: 0 auto 30px;border-spacing: 0;" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td>
                <table style="width: 100%;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
                    <tbody>
                        <tr>
                            <td style="vertical-align: bottom;">
                                <table style="margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td>
                <img class="imgBox" src="https://template.casavaticano.com.br//templates/7281902.jpeg" style="max-width: 200px;max-height:200px; top: 0px;vertical-align: top;">
            </td>
        </tr>
    </tbody>
</table>
 
                            </td>
                        </tr>
                    </tbody>
                </table>
                <table style="margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
                    <tbody>
                        <tr>
                            <td style="line-height: 80%;text-align: center;" width="210px" height="70px">
                                    <span class="txtInfo" style="text-transform: uppercase;">
                                    <span class="txtNome" style="font-weight: 900;color: black;font-size: 9pt;">Café Pilão</span><br>
                                    <span class="txtDesc" style="font-weight: 400;font-size: 8pt;">Extraforte Almofada 500g</span>
                                </span>
                            </td>
                        </tr>
                    </tbody>
                </table>
                                <table style="margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td class="txtPreco" style="min-width: 130px;padding: 4px 0;text-align: center;border-radius: 6px;font-weight: 900;line-height: 1;background-color: #dd1a3a;">
                <a class="btnPreco" href="http://www.walmart.com.br/" style="text-decoration: none;padding: 20px 20px 0;">
                    <span class="txtCurrency" style="color: yellow;">R$</span> 
                    <span class="txtInteger" style="color: yellow;font-size: 32pt;">7</span>
                    <span class="txtCents" style="color: yellow;yellow;font-size: 16pt">,44</span>
                </a>
            </td>
        </tr>
    </tbody>
</table>
 
            </td>
        </tr>
    </tbody>
</table>

                                </td>
                                                                                                                                                <tr>
                                                                <td valign="bottom" align="centered">
                                                                        <table class="simples" style="width: 210px;display: inline-block;margin: 0 auto 30px;border-spacing: 0;" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td>
                <table style="width: 100%;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
                    <tbody>
                        <tr>
                            <td style="vertical-align: bottom;">
                                <table style="margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td>
                <img class="imgBox" src="https://template.casavaticano.com.br//templates/7465255.jpeg" style="max-width: 200px;max-height:200px; top: 0px;vertical-align: top;">
            </td>
        </tr>
    </tbody>
</table>
 
                            </td>
                        </tr>
                    </tbody>
                </table>
                <table style="margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
                    <tbody>
                        <tr>
                            <td style="line-height: 80%;text-align: center;" width="210px" height="70px">
                                    <span class="txtInfo" style="text-transform: uppercase;">
                                    <span class="txtNome" style="font-weight: 900;color: black;font-size: 9pt;">Cerveja Brahma</span><br>
                                    <span class="txtDesc" style="font-weight: 400;font-size: 8pt;">Lata 350ml cada Pack com 18 unidades</span>
                                </span>
                            </td>
                        </tr>
                    </tbody>
                </table>
                                <table style="margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td class="txtPreco" style="min-width: 130px;padding: 4px 0;text-align: center;border-radius: 6px;font-weight: 900;line-height: 1;background-color: #dd1a3a;">
                <a class="btnPreco" href="http://www.walmart.com.br/" style="text-decoration: none;padding: 20px 20px 0;">
                    <span class="txtCurrency" style="color: yellow;">R$</span> 
                    <span class="txtInteger" style="color: yellow;font-size: 32pt;">34</span>
                    <span class="txtCents" style="color: yellow;yellow;font-size: 16pt">,02</span>
                </a>
            </td>
        </tr>
    </tbody>
</table>
 
            </td>
        </tr>
    </tbody>
</table>

                                </td>
                                                                                                                                                <td valign="bottom" align="centered">
                                                                        <table class="parcelado" style="width: 320px;display: inline-block;margin: 0 auto 30px;border-spacing: 0;" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td>
                                <table style="margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td>
                <img class="imgBox" src="https://template.casavaticano.com.br//templates/8931023.jpeg" style="max-width: 200px;max-height:200px; top: 0px;vertical-align: top;">
            </td>
        </tr>
    </tbody>
</table>
 
                                <table style="width: 100%;height: 70px;margin-bottom: 2px;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
                    <tbody>
                        <tr>
                            <td style="vertical-align: bottom;">
                                <table style="text-align: left;width: 110px;margin: 0 auto 4px;border-spacing: 0;" cellspacing="0" cellpadding="0">
                                    <tbody>
                                        <tr>
                                            <td style="line-height: 80%;">
                                                <span class="txtInfo">
                                                    <span class="txtNome" style="font-weight: 900;color: black;font-size: 9pt;line-height: 80%;text-transform: uppercase;">Smart TV 49&quot; LG</span>
                                                    <br>
                                                    <span class="txtDesc" style="font-weight: 400;font-size: 8pt;line-height: 80%;">Com acesso à internet</span>
                                                </span>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </td>
                            <td style="vertical-align: bottom;">
                                                                <table style="text-align: left;width: 190px;font-weight: 900;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
                                    <tbody>
                                        <tr>
                                            <td>
                                                <table style="width: 190px;text-align: left;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
                                                    <tbody>
                                                        <tr>
                                                            <td>
                                                                
                                                                <table style="margin: 0 auto;margin-right: 10px;border-spacing: 0;">
                                                                    <tbody>
                                                                        <tr>
                                                                            <td style="line-height:1.1;">
                                                                                <table style="margin: 0 auto;border-spacing: 0;text-align: right;" width="32px" cellspacing="0" cellpadding="0">
                                                                                    <tbody>
                                                                                        <tr>
                                                                                            <td>
                                                                                                <span style="color:#dd1a3a;font-weight: 700;font-size: 7pt;">À vista</span>
                                                                                                <span style="color: #dd1a3a;font-size: 14pt;">R$</span>
                                                                                            </td>
                                                                                        </tr>
                                                                                    </tbody>
                                                                                </table>
                                                                            </td>
                                                                            
                                                                            <td>
                                                                                <table style="margin: 0 auto;margin-right: 0px;border-spacing: 0;">
                                                                                    <tbody>
                                                                                        <tr>
                                                                                            <td>
                                                                                                <span style="color: #dd1a3a;font-size: 30pt;">2.199</span>
                                                                                            </td>
                                                                                        </tr>
                                                                                    </tbody>
                                                                                </table>
                                                                            </td>
                                                                            <td style="text-align: right;line-height: 0.7">
                                                                                <span style="color: #dd1a3a;font-size: 18pt;">,00</span>
                                                                                <span style="color:#dd1a3a;font-weight: 700;font-size: 7pt;">cada</span>
                                                                            </td>
                                                                            
                                                                        </tr>
                                                                    </tbody>
                                                                </table>
                                                                
                                                            </td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </td>

                        </tr>
                    </tbody>
                </table>
                                <table style="text-align: left;width: 320px;height: 60px;font-weight: 900;border-radius: 6px;border-style: solid;border-width: 1px;background-color: #29417f;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
                    <tbody>
                        <tr>
                            <td>
                                <table style="width: 320px;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
                                    <tbody>
                                        <tr>
                                            <td>
                                                <table style="display: inline-block;width: 100px;line-height: 23px;margin-left: 5px;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
                                                    <tbody>
                                                        <tr>
                                                            <td>
                                                                <table style="margin: 0 auto;border-spacing: 0;margin-left: 5px;" cellspacing="0" cellpadding="0">
                                                                    <tbody>
                                                                        <tr>
                                                                            <td style="width:100px;">
                                                                                <span style="font-size: 6pt;color: white;text-transform: uppercase;">nos nossos cartões</span>
                                                                            </td>
                                                                        </tr>
                                                                    </tbody>
                                                                </table>
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <td>
                                                                <table style="margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
                                                                    <tbody>
                                                                        <tr>
                                                                            <td style="width:100px;">
                                                                                <img style="width: 50px;margin-left: 5px;" src="http://template.casavaticano.com.br/resources/cartoes.png">
                                                                            </td>
                                                                        </tr>
                                                                    </tbody>
                                                                </table>

                                                            </td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                                                                                <table style="display: inline-block;width: 200px;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
                                                    <tbody>
                                                        <tr>
                                                            <td>
                                                                <table style="width: 200px;color: yellow;margin: 0 auto;border-spacing: 0;" cellspacing="0" cellpadding="0">
                                                                    <tbody>
                                                                        <tr>
                                                                            <td>
                                                                                
                                                                                <table style="margin: 0 auto;margin-right: 0px;border-spacing: 0;">
                                                                                    <tbody>
                                                                                        <tr>

                                                                                            <td style="line-height: 1;">
                                                                                                <table style="text-align: right;margin: 0 auto;border-spacing: 0;" width="20px" cellspacing="0" cellpadding="0">
                                                                                                    <tbody>
                                                                                                        <tr>
                                                                                                            <td>
                                                                                                                <span style="font-size: 14pt;">R$</span>
                                                                                                            </td>
                                                                                                        </tr>
                                                                                                        <tr>
                                                                                                            <td style="color:black;">
                                                                                                                <span style="font-size: 18pt;"></span>
                                                                                                                <span style="font-size: 18pt;color:white">15X</span>
                                                                                                            </td>
                                                                                                        </tr>
                                                                                                    </tbody>
                                                                                                </table>
                                                                                            </td>
                                                                                            
                                                                                            <td>
                                                                                                <table style="margin: 0 auto;margin-right: 0px;border-spacing: 0;">
                                                                                                    <tbody>
                                                                                                        <tr>
                                                                                                            <td>
                                                                                                                <span style="font-size: 38pt;">146</span>
                                                                                                            </td>
                                                                                                        </tr>
                                                                                                    </tbody>
                                                                                                </table>
                                                                                            </td>
                                                                                            <td style="margin: 0 auto;border-spacing: 0;line-height: 0.8;text-align: center;">
                                                                                                <span style="font-size: 20pt;">,60</span>
                                                                                                <br>
                                                                                                <span style="font-weight: 700;font-size: 8pt;color: white;">sem juros</span>
                                                                                            </td>
                                                                                        </tr>
                                                                                    </tbody>
                                                                                </table>
                                                                                
                                                                            </td>
                                                                        </tr>
                                                                    </tbody>
                                                                </table>
                                                            </td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>
    </tbody>
</table>


                                </td>
                                                                                                        </tr>
                </tbody>
            </table>
            
                      <table cellpadding="0" cellspacing="0" style="width: 100%;height: 40px;margin: 0 0 10px;text-align: center;border-spacing: 0;">
                <tr>
                    <td>
                        <a class="btnConfira" href="https://www.walmartbrasil.com.br" target="_blank" style="text-decoration: none;text-transform: uppercase;font-size: 10pt;font-weight: 900;color: #007DC3;background-color: #f7c02b;padding: 12px 32px;border-radius: 24px;letter-spacing: 1px;">
                        Confira mais ofertas &gt;</a>
                    </td>
                </tr>
            </table>   
            <table cellpadding="0" cellspacing="0" style="width: 100%;height: 20px;margin: 2 0 0 10px;text-align: center;border-spacing: 0;">
                <tr>
                    <td>
             <img style=" width: 500px; margin:0;"src="https://template.casavaticano.com.br/TEXTOS%20LEGAIS/LT.BEBIDAS-2.png">
            </table>   
            <div style="height: 16px"><table style="margin: 0 auto;border-spacing: 0;"><tr>

            <td style=";display: inline-block;margin: 0;border-spacing: 0;border-radius: 6px 0 0 6px;padding: 14px 2px 8px 10px;background-color: #f7c02b;"><span style="color:#dd1a3a;font-style: italic;font-weight:900;font-size: 14pt;margin-right: 6px;line-height: 1;">Passa no</span></td>
            <td style=";display: inline-block;margin: 0;border-spacing: 0;border-radius: 0 6px 6px 0;background-color: #027dc2;">
                <img style="height: 35px;" src="https://template.casavaticano.com.br/bandeiras/WALMART.png">
            </td>
            </tr></table></div>
        <div style="width: 100%;max-width:700px;height: 12px;background-color: #f7c02b;margin: 0;border-spacing: 0;">
        </div>
                          <table cellpadding="0" cellspacing="0" class="txtBompreco" style="margin: 0 0 0;border-spacing: 0;width: 100%;height: 64px;font-size: 12pt;font-weight: 700;background-color: #007cc9;letter-spacing: 1px;">

    <tr>    
        <td>
           
            <table cellpadding="0" cellspacing="0" style="margin: 15px auto;border-spacing: 0;">
                <tr>
                    <td>
                    </td>
                    <td align="center"><img style="height:40px;margin: 0 10px;" src="https://template.casavaticano.com.br/icons/Localizacao-novo.png"></td>
                                        <td>
                        <a href="https://tabloide.walmartbrasil.com.br/" target="_blank" style="text-decoration: none;"><span style="color: #f7c02b; margin-top:" >CLIQUE AQUI</span> <span style="color: white;">E VÁ ATÉ A LOJA MAIS PRÓXIMA</span></a>
                </td>
            </tr>
        </table>
                <table cellpadding="0" cellspacing="0" class="txtSigaFacebook" style="margin: 0;border-spacing: 0;width: 100%;height: 74px;font-size: 12pt;font-weight: 700;background-color: #49aee9;letter-spacing: 1px;color: white;">
            <tr>
                <td>
                    <table cellpadding="0" cellspacing="0" style="margin: 0 auto;border-spacing: 0;">
                        <tr>
                            <td><span>Siga a gente nas redes sociais:</span><img src=""></td>
                                                        <td align="center">
                                <a href="https://www.facebook.com/walmartbrasil/" target="_blank" style="text-decoration: none;"><img style="height:36px;margin: 0 10px;" src="https://template.casavaticano.com.br/icons/facebook-novo.png"></a>
                                 <a href="https://www.instagram.com/walmartbrasil" target="_blank" style="text-decoration: none;"><img style="height:36px;margin: 0 10px;" src="https://template.casavaticano.com.br/icons/instagram-novo.png"></a>
                                 <a href="https://www.youtube.com/user/walmartinstitucional" target="_blank" style="text-decoration: none;"><img style="height:36px;margin: 0 10px;" src="https://template.casavaticano.com.br/icons/youtube-novo.png"></a>
                            </td>
                                                    </tr>
                    </table>
                </td>
            </tr>
        </table>
            </td>
        </div>
</table>
<table style="width: 100%;max-width: 700px;margin: 20px auto;padding: 0 30px;text-align: center;font-size: 9pt;line-height: 1.2;border-spacing: 0;" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td><pre>Material vigente para 09/08/2019 ou enquanto durarem os estoques. Nem
todos os produtos estão disponíveis nas lojas Walmart, podendo variar de acordo
com o estoque ou sortimento de cada loja. Consulte a loja mais próxima. Para
melhor atender nossos clientes, não vendemos por atacado e reservamo-nos o
direito de limitar a quantidade de 12un./kg por cliente dos produtos anunciados.
Nas lojas participantes garantimos a quantidade mínima de 12un./kg por loja dos
produtos anunciados na data de início do anúncio. Fotos meramente ilustrativas.</span></td>
        </tr>
    </tbody>
</table>

                        </body>
</html>"

Obrigada

Share this post


Link to post
Share on other sites

Olá, sou novo com js e html, novo quando eu digo é uma semana :sweat_smile:

mas tive uma ideia, caso você não tenha nem uma outra ideia...

 

só me vem a cabeça uma ideia, mudar todos os valores de tamanho da <img>;

você vai abrir o inspetor dentro do navegador q esta com o problema.. dps vai ver como ele se identifica...

usando o window.navigator  existe muitas propriedades q define um navegador.. então você escolhe as q deseja...

 

  • usa onload como gatilho
  • navigator como filtro
  • tem muito onload... você ver qual se adapta mais no caso..

Ex com chome

<!--
<body onload="ajuste()">

======================SCRIPT===========================
function ajuste(){
	if(window.navigator.appName == "Netscape"){
		muda os valores de cada <img>
	}
=======================================================
}
-->

 

    Reavaliando o seu código.. e meio q desfazendo ele... percebi q existe uma forma mais facil e mais "Certa" os tamanhos das imagem é um tamanho muito grande para uma apresentação pequena..

ou seja.

    a pagina demora mais para carregar e exibe pouco, ou seja mais gasto de download, e em um celular onde a internet fornecida por operadoras são a baixo da media.. isso é um problema..

recomendo forte mente q ajuste os tamanhos das imagens em um editor de foto.. e colocando com exportação para web de formar q fique no tamanho ideia..

   essa ação vai fazer o site ficar mais leve e não vai existir o problemas de tamanho desproporcional ja q o navegador não vai forçar um esticamento da imagem... 

 

possível erro... o navegador não esta identificando com comando de ajuste da imagem.. fazendo fica em seu tamanho original..

Share this post


Link to post
Share on other sites

como estou começando a aprender html e css.. vou treinar fazendo isso ai.. se eu terminar ate o fim do dia eu te mando...

caso so tenha html e css é claro.. não vi exatamente o código só isolei o problema

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By daviassumpcao
      Estou buscando uma orientação ou referência para desenvolver algo similar ao formulário dessa página do iPhone https://www.apple.com/shop/buy-iphone/iphone-se ... quando selecionamos alguma opção, a div que contém o formulário centralizar na página e rola feito um carrossel. Estou completamente perdido com essa demanda que recebi... agradeço antecipadamente a todos que derem uma força. Abraço
    • By lucasseribeiro
      Bons dias, fórum!
       
      Procurei uma área específica para o JavaFX e não encontrei... Estou aprendendo a usar essa biblioteca, está ficando interessante, se assemelha às tecnologias web com as quais tenho muita familiaridade pois uso há anos. Mas o CSS do JavaFX é diferente daquele do consórcio W3, e não estou encontrando material para entender esse -fx-CSS... A referência CSS da Oracle (https://docs.oracle.com/javase/8/javafx/api/javafx/scene/doc-files/cssref.html) é obscura e não contém as infos que preciso, apesar de esclarecer muitas coisas... Passa uma impressão de que eles não querem que todos saibam!
      Por exemplo: ao estilizar uma menu-bar, mudei seu background, alterei a cor da fonte dos menus, mas eles ficaram colados uns nos outros, e eu não entendi como escolher a propriedade CSS adequada do FX para controlar a distância dos menus. Pude usar um padding, mas ao executar, quando abrimos um menu, os outros ainda são empurrados pois ainda que suas inscrições estejam separadas, os botões do menu ainda estão colados. O tutoriais não abordam o CSS do FX em profundidade, focam-se nos objetivos dos projetos e suas abordagens...
      Rsrs, podia ter no W3Schools... Alguém pode me ajudar com isso???
       
      Grato desde já!
       
      Lucas Ribeiro
    • By Alberto Nascimento
      Como faço que consiga colocar parágrafos no campo tipo "text" do formulário?
          <input name="Text1" style="width: 528px; height: 223px" type="text" /></form>
      Se eu pressiono ENTER automaticamente envia o formulário
      Como então consigo digitar ao preencher o formulário da forma abaixo?
       
    • By Sapinn
      Estou com dificuldade para chamar um arquivo CSS usando a configuração de um arquivo php. O bootstrap também não surte efeito na paginas
       
      Vejam só
      Config.php
       
      <?php define('APP_NOME','Projeto GIBI'); define('URL','http://localhost/bora_php');  
       
      index.php
       
      <?php include './../app/configuracao.php'; include './../app/Libraries/Rota.php'; include './../app/Libraries/Controller.php'; ?> <!DOCTYPE html> <html lang="pt-br"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <link rel="stylesheet" href="<?=URL?>/public/css/estilos.css">     <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" >         <title><?= APP_NOME?></title> </head> <body>     <?php         $rotas = new Rota();     ?>     <script src="https://code.jquery.com/jquery-3.5.1.min.js" ></script> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" ></script> <script src="<?=URL?>/public/css/script.js" ></script> </body> </html> estilo.css
      html{     background-color: red; }  
      Estou tentando seguir a padronização MVC(que por sinal eu tenho certa dificuldade), então não consigo achar onde estou errando
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.