I created a two-column template with floating divs as the basis for a site redesign I am doing. The template has worked fine for a dozen pages or so, but I hit a snag. I added a table to the left div and now the right div falls below the left in IE8. There are no problems in Chrome, Safari, Opera, and Firefox. I played around with the table for awhile and pinpointed the problem. It occurs when I add the attribute, rowspan="4" to the td tag. I have no idea how to fix this problem, other than not using the rowspan attribute, which seems impractical. Any ideas?
Rule 1: Validate! Your page is a mishmash of HTML 4 (XHTML-incompatible) and XHTML markup - choose one and stick to it. The validator sees 28 errors for each version as the declared XHTML, and 20 errors when revalidated as HTML4. Some of the reported errors are with table elements, but it's impossible to tell if these are follow-ons that will vanish if some earlier error is fixed.
Creating valid code may even fix your problem - but if it doesn't, it will give us a decent starting point to analyse it. Remember - how borowsers handle invalid code is outside the specifications, and is therefore responsible for most cross-browser differences