Question

So our site was designed without a doctype, and I’m trying to update it so that it’s not forcing IE into quirks mode.
The problem is, there are a few tables that were using rounded corner images since the devs didn’t understand how to use a div-based design. This looks normal in quirks mode and even IE7 mode, but when I use IE8 or IE9 standards mode, some of the rows in the table end up being taller than they should (namely the rows that contain the rounded corner images) and no amount of forced height seems to work. Is there some basic table display method I’m missing? This looks fine in all browsers EXCEPT IE8 and IE9, which to me is baffling. I’ve copied the code (with fully qualified image links) to jsbin, and you can view it here:
http://jsbin.com/ofedet/

I know the best method is to go ahead and replace these with divs or some other semantic element with border-radius, but for the time being I was hoping to just fix these issues to stave off disaster until I can convince them of the ROI of a redesign.

Answer 1

Let those images float.

#Table_01 img { 
    float: left;
}