On Tue, Jun 17, 2014 at 7:26 PM, J.C. Berry <jcharlesbe...@gmail.com> wrote: > Hello, I have a question about a simple layout here. The width is 660px as > you can see, with the two columns 405px and 240px respectively. I've zeroed > out the margins and padding as needed, but the right col still drops down. > Any ideas? > > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " > http://www.w3.org/TR/html4/loose.dtd";> > <html> > <head> > <title>Your Email Title</title> > <style type="text/css"> > body{background-color:#d0d0d0;font:14px > tahoma;padding:0;margin:0;}/*Which font to use be default?*/ > #emailwrapper{width:660px;margin:0 auto;padding:0;} > #email_hdr{height:65px;vertical-align:middle;padding:0;margin:0;} > #email_hdr div{vertical-align:middle;padding:0;margin:0;} > #email_hdr div img{float:right;} > #email_banner_graphic{background-color:#fff;padding:0;margin:0;} > #email_left_col_top,#email_left_col_bottom{margin:15px 0 0 > 0;width:405px;float:left;background-color:#fff;padding:0;} > > #email_right_col{padding:0;width:240px;float:left;background-color:#fff;vertical-align:top;margin:15px > 0 0 15px;} > #email_footer{font:11px > tahoma;color:#000;text-align:center;padding:0;margin:0;} > #email_hdr div,#email_banner_graphic div,#email_left_col_top > div,#email_left_col_bottom div,#email_right_col div,#email_footer > div{padding:15px;margin:0;} > </style> > </head> > <body> > <table id="emailwrapper"> > <tr> > <td colspan="2" id="email_hdr"> > <div><img src="http://mysite.com/_logo.png"; id="logo" > width="152" height="35" /></div> > </td> > </tr> > <tr> > <td colspan="2" id="email_banner_graphic"> > <div class="mktEditable"> > > </div> > </td> > </tr> > <tr> > <td id="email_left_col_top"><div class="mktEditable"></div></td> > <td id="email_right_col" rowspan="2"><div > class="mktEditable"></div></td> > </tr> > <tr> > <td id="email_left_col_bottom"><div > class="mktEditable"></div></td> > </tr> > <tr> > <td colspan="2" id="email_footer"> > <div>Address for company</div> > </td> > </tr> > </table> > </div> > </body> > </html> > > --
Is this an actual, for-real email? Is this a template from Marketo or are you creating it? You are doing far too much with embedded CSS. You should go all "old-school" on the table and add all the attributes to the table as well as td's. I recommend inline styles for text styling and maybe a little layout tweaking too, but really, html email is not a fun thing. It is very crude with terrible and variable support for anything beyond basic table-based construction. Heck, I still use a spacer gif if I can't fix something any other way. I do A LOT of html email and still struggle with stuff. Floats are not well supported at all - if at all - as well as declared margins on most things. We do a little responsive email work, but that is very crude as well. I recommend a service like Litmus or Email On Acid for checking your email layouts. They also provide tips on correcting issues as well as optimizations, etc. litmus.com emailonacid.com If you know all this, well...maybe someone else can benefit... HTH -- Tom Livingston | Senior Front-End Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com ______________________________________________________________________ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
![http://mysite.com/_logo.png"](http://mysite.com/_logo.png"){kind=link}