Whilst working on some email templates the other day I found another Internet Explorer annoyance (bug?).

HTML emails are difficult to create because of the varying standards employed across email clients. And with Outlook 2007 that has dropped CSS support back something like 5 years, I decided to go back to basics - tables based layout, that'd work surely?

Nope, well not how I wanted them to.

The problem is, when you have a fixed sized cell and a cell in the column next to it spans more than one row, and a fluid width on that rowspan-ed column - the height of the 'fixed' cell becomes fluid. I did a mockup here, try resizing the page in Internet Explorer and see the red cell's height change once the text starts overflowing into the second row.

This isn't always a problem because you can easily put a nested table into the red cell to constrain it to the fixed dimensions. However imagine you are trying to line up images to create your design. and you need the bottom of the red cell column to marry up with the bottom of the 2nd column. Well it's beat me anyway…

Comments? Tweet me @mealybar, smoke signals, or homing pigeon, or something :)