{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 Juvenile、少年° 的问题《Rich HTML emails in Outlook 2007 and 2010… how do》','https://www.manongdao.com/q-1201616.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
I have a rich HTML email. I was wondering how, in Outlook 2010 and 2007, you get the table in the layout to sit flush with the edge of the browser?
Have a look at this pic:
The pink is the background color of the body tag and the grey is the bg of the table. They both have 0 everything (margin, paddting ect). But there is still some space. The pink should not be visible.
Does anyone know how to get rid of this space on the body?
Also here’s some CSS for the start of the email:
<html>
<head>
<style type="text/css">
html, body{ width:100%; }
body{ background-color:#ff00ff; }
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Test</title>
</head>
<body topmargin="0" style="margin:0; padding:0; width:100%; background-color:#ff00ff;" >
<table topmargin="0" align="center" cellpadding="0" cellspacing="0" width="100%" style="border-collapse: collapse;border-spacing: 0;border: 0; margin:0; padding:0; background-color:#eee;" >
Cheers!
As outlook doesn't support margin -reference. My work around to this issue was as below. Hope it will help someone.
With pure CSS (I'm not sure the makers of IE like reading that), you can use
!importantto force the margin and padding of the<table>and the<body>to be0px:Maybe it'll work, but maybe not. I'm not sure how Outlook handles CSS...
Outlook 2007/2010 adds 15px top/bottom and 10px left/right body padding to all html emails. You can't get rid of it.
Here's a trick to fake full backgrounds: http://www.campaignmonitor.com/forums/viewtopic.php?pid=17048Try using
margintop="0" marginleft="0" marginright="0"on the<body>tag (updated to full example):You will need to set the width of 600 to whatever the width of your email is.
There are cross-email client bugs with body tags, and padding/margin values in CSS.
NB - this is only necessary, and only works, on the body tag.
Stange that the
<body style="padding:0px; margin:0px;">doesn't work.I find that with outlook 2007/2010 that if you have
padding-topapplied to a column but not the other columns in the same row Outlook will apply that padding to all the columns for some reason. Are you able to paste more of the email code so we can have a look that its not something else causing the issue.Outlook uses the broken Microsoft Word HTML engine and is not based on any reasonable resemblance to a browser.
If you have Word, you can at least open your email as html and see how it renders it without having to go through the whole mail cycle.
Outlook really in the bane of any email marketer. It is an absolute pile of crap and fails to support even the most basic CSS expectations.
I'd have to have many frank and disappointing discussions with graphic designers over the limitations of email as a platform due to Outlook. Microsoft has seriously made a step backwards in using the Word engine for Outlook.