Contenu e-mail sur une largeur délimitée et centré

Résolu/Fermé
Emmanueldm - Modifié le 13 janv. 2021 à 16:07
telliak Messages postés 3667 Date d'inscription mercredi 20 septembre 2006 Statut Membre Dernière intervention 4 novembre 2024 - 13 janv. 2021 à 16:03
Bonjour,

Pour faire plus pro et pour faciliter sa lecture, j'aimerais que le texte de mon e-mail soit délimité sur une largeur maximum (si je ne me trompe pas, 600 px est la norme), que cette largeur soit au centre de la fenêtre, et que le texte à l'intérieur de cette largeur soit aligné sur la gauche.

Pour l'instant, j'ai ceci (ne faites pas attention aux signes ' et +, c'est parce que j'envoie l'e-mail depuis Google Apps Script) :

//ligne grise
'<table border="0" cellpadding="0" cellspacing="0" width="100%" class="m_-3978233801944340083mcnDividerBlock" style="min-width:100%;border-collapse:collapse;table-layout:fixed!important">    <tbody>        <tr>            <td style="min-width:100%;padding:18px">                <table border="0" cellpadding="0" cellspacing="0" width="100%" style="min-width:100%;border-top:2px solid #eaeaea;border-collapse:collapse">                    <tbody><tr>                        <td>                            <span></span>                        </td>                    </tr>                </tbody></table>            </td>        </tr>    </tbody></table>'
//mise en forme du texte
+ '<table border="0" cellpadding="0" cellspacing="0" width="100%" style="min-width:100%;border-collapse:collapse">    <tbody>        <tr>            <td valign="top" style="padding-top:9px"> <table align="left" border="0" cellpadding="0" cellspacing="0" style="max-width:100%;min-width:100%;border-collapse:collapse" width="100%" class="m_-3978233801944340083mcnTextContentContainer">                    <tbody><tr>                        <td valign="top" class="m_-3978233801944340083mcnTextContent" style="padding:0px 18px 9px;font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;word-break:break-word;color:#222222;font-size:16px;line-height:150%;text-align:left">'
+ TEXTE
//stop mise en forme du texte
+ '</td>                    </tr>                </tbody></table>                   </td>        </tr>    </tbody></table>'
//ligne grise
+ '<table border="0" cellpadding="0" cellspacing="0" width="100%" class="m_-3978233801944340083mcnDividerBlock" style="min-width:100%;border-collapse:collapse;table-layout:fixed!important">    <tbody>        <tr>            <td style="min-width:100%;padding:18px">                <table border="0" cellpadding="0" cellspacing="0" width="100%" style="min-width:100%;border-top:2px solid #eaeaea;border-collapse:collapse">                    <tbody><tr>                        <td>                            <span></span>                        </td>                    </tr>                </tbody></table>            </td>        </tr>    </tbody></table>'
//mise en forme du texte
+ '<table border="0" cellpadding="0" cellspacing="0" width="100%" style="min-width:100%;border-collapse:collapse">    <tbody>        <tr>            <td valign="top" style="padding-top:9px">                   <table align="left" border="0" cellpadding="0" cellspacing="0" style="max-width:100%;min-width:100%;border-collapse:collapse" width="100%" class="m_-3978233801944340083mcnTextContentContainer">                    <tbody><tr>                        <td valign="top" class="m_-3978233801944340083mcnTextContent" style="padding:0px 18px 9px;font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;word-break:break-word;color:#222222;font-size:16px;line-height:150%;text-align:left">'
+ '<table width="300" align="center">'
+ '<tr>'
+ '<td>TEXTE</td>' 
+ '<td>' + TEXTE + '</td>'
+ '</tr>'
+ '<tr>'
+ '<td>TEXTE</td>' 
+ '<td>' + TEXTE + '</td>'
+ '</tr>'
+ '</table>'
//stop mise en forme du texte
+ '</td>                    </tr>                </tbody></table>                   </td>        </tr>    </tbody></table>'
//ligne grise
+ '<table border="0" cellpadding="0" cellspacing="0" width="100%" class="m_-3978233801944340083mcnDividerBlock" style="min-width:100%;border-collapse:collapse;table-layout:fixed!important">    <tbody>        <tr>            <td style="min-width:100%;padding:18px">                <table border="0" cellpadding="0" cellspacing="0" width="100%" style="min-width:100%;border-top:2px solid #eaeaea;border-collapse:collapse">                    <tbody><tr>                        <td>                            <span></span>                        </td>                    </tr>                </tbody></table>            </td>        </tr>    </tbody></table>'
//mise en forme du texte
+ '<table border="0" cellpadding="0" cellspacing="0" width="100%" style="min-width:100%;border-collapse:collapse">    <tbody>        <tr>            <td valign="top" style="padding-top:9px">                   <table align="left" border="0" cellpadding="0" cellspacing="0" style="max-width:100%;min-width:100%;border-collapse:collapse" width="100%" class="m_-3978233801944340083mcnTextContentContainer">                    <tbody><tr>                        <td valign="top" class="m_-3978233801944340083mcnTextContent" style="padding:0px 18px 9px;font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;word-break:break-word;color:#222222;font-size:16px;line-height:150%;text-align:left">'
+ TEXTE
//stop mise en forme du texte
+ '</td>                    </tr>                </tbody></table>                   </td>        </tr>    </tbody></table>'
//ligne grise
+ '<table border="0" cellpadding="0" cellspacing="0" width="100%" class="m_-3978233801944340083mcnDividerBlock" style="min-width:100%;border-collapse:collapse;table-layout:fixed!important">    <tbody>        <tr>            <td style="min-width:100%;padding:18px">                <table border="0" cellpadding="0" cellspacing="0" width="100%" style="min-width:100%;border-top:2px solid #eaeaea;border-collapse:collapse">                    <tbody><tr>                        <td>                            <span></span>                        </td>                    </tr>                </tbody></table>            </td>        </tr>    </tbody></table>'
;

Comme vous le voyez, il y a des lignes grises au milieu du texte que j'aimerais également délimiter dans la largeur et centrer.

J'ai fait un grand nombre de tests, mais ils ont tous échoués :(

Merci infiniment pour votre aide !
A voir également:

1 réponse

telliak Messages postés 3667 Date d'inscription mercredi 20 septembre 2006 Statut Membre Dernière intervention 4 novembre 2024 876
13 janv. 2021 à 16:03
Salut,
C'est bien beau de dire ne faites pas attention aux signes ' et +, mais c'est totalement illisible ce que tu présentes là...
0