Position relative non prise en compte dans Newsletter

Bonjour,

Je travaille sur une Newsletter dont une version test se trouve ici : http://www.toulouse.elusverts.fr/lalettre/newsletter.html

En affichant le code source vous verrez que j'utilise un positionnement relatif avec une valeur négative pour pouvoir positionner la div #blog à côté de la div #agenda, voir la portion de css ci-dessous :

#agenda {
	background-image: url(http://www.toulouse.elusverts.fr/lalettre/rendezvous.png);
	background-repeat: no-repeat;
	height: 300px;
	width: 300px;
	margin-left: 20px;
}

#blog {
	background-image: url(http://www.toulouse.elusverts.fr/lalettre/blog.png);
	background-repeat: no-repeat;
	height: 300px;
	width: 450px;
	margin-right: 0;
	margin-left: auto;
	position: relative;
	margin-top: -300px;	
}

Pas de problème d'affichage sur les navigateurs, en revanche un Webmail tel que celui de Yahoo ne semble pas tenir compte du positionnement relatif (ou de la valeur négative qui lui est associée), puisque le bloc #blog s'y affiche suivant le flux, totalement décalé vers le bas au lieu d'apparaître à côté du bloc #agenda...

J'ai lu quelque part qu'il valait mieux éviter les valeurs négatives pour les Newsletters... Mais je ne vois pas comment afficher ces deux blocs côte à côte sans en utiliser !

Ou bien devrais-je changer mon fusil d'épaule et revoir la structure de ma page pour utiliser des tableaux au lieux de divs ?

Merci d'avance à qui pourra m'éclairer !