Outlook 2010 et HTML Tables

Question

Je ne fais que créer un bulletin d'information par e-mail, et je n'arrive pas à comprendre comment forcer Outlook à afficher mon tableau HTML correctement.

Il est par exemple simple:

<table cellpadding="0" cellspacing="0" id="outlookHack" 
    style="table-layout:fixed; border: 0; background-color: #1E6C9D; 
      background-image: url(http://www.komix.cz/upload/img_bg.png); 
      background-repeat: repeat-y; margin-top: 0px; margin-bottom: 0px; 
      padding: 0px; margin-left: auto; margin-right: auto; 
      text-align: center;width: 620px;" width="620"> 
<tr> 
    <td width="10" style="width: 10px; background:inherit;" height="10">&nbsp;</td> 
    <td width="600" style="width: 600px; background:ihnerit;" height="10"></td> 
    <td width="10" style="width: 10px; background:inherit;" height="10">&nbsp;</td> 
<tr> 
<tr> 
    <td width="10" style="width: 10px; background: inherit;">&nbsp;</td> 
    <td width="600" style="width: 600px; background: white;">some content...</td> 
    <td width="10" style="width: 10px; background: inherit;">&nbsp;</td> 
<tr> 
</table> 

Le problème est que gauche et droite colonnes doivent avoir une taille fixe de 10px, mais les perspectives 07/10 les rend comme 5px +/-.

Answer 1

KISS - Keep it simple (stupide)

Perspectives 07-présent utilise le moteur de rendu de Word, qui est essentiellement IE (qui est stupide) plus abêtis. Cela vous force à recoder les standards html 1, et limite vraiment ce que vous pouvez faire. Pour commencer, abandonner fondamentalement sur CSS complexe. Il peut être utilisé (en ligne) mais une grande partie ne fonctionne pas. Donc, en utilisant le tableau de compatibilité, le support d'arrière-plan est presque inexistant .... le perdre. Les répétitions d'arrière-plan ne sont pas prises en charge et le remplissage n'est pas vraiment très bien supporté non plus.

Maintenant, comment résoudre votre problème de remplissage? Vous pouvez utiliser le cellpadding pour ajouter de l'espace, mais cela a parfois des effets indésirables sur les zones que vous ne voulez pas rembourrées. Certaines personnes utilisent des tables imbriquées pour fournir le remplissage nécessaire, en utilisant outer pour contrôler la mise en page et la ou les tables internes pour contrôler le paragraphe. Notez que les marges sont également supportées en fonction de la doc, de sorte que vous pouvez utiliser des marges sur les paragraphes, en abandonnant les colonnes gauche et droite de 10 pixels en faveur d'un paragraphe avec 10 marges de pixels.

Notez également que vous devez éviter toute CSS sténographie, à savoir border:1px solid #000

Merci, Microsoft. Alors que vous êtes en train de nous rendre fou les Développeurs d'UI avec votre qualité de moteur de rendu régressant et l'évitement général des standards de base, vous nous faites aussi beaucoup d'argent supplémentaire.