Jon's Blog

.NET Development & More

IE8: Image max-width bug

I found a strange IE8 bug dealing with images and the CSS max-width property.  I had an image inside of a table cell.  The image had a max-width set using CSS.  In IE8, if the actual image width was larger than the max-width value then the image was resized properly, but the table cell was not.  It was strange because it worked fine in IE7 and Firefox.  The way I fixed this issue was to wrap the image inside of a div and then set the width of the div to the same value as the max-width of the image.  Oh well, easy enough.


<table class="myTable">
        <td class="col1">
            <div class="imageWrapper">
                <img src="images/blah.jpg" class="myImage" />
        <td class="col2">
            <p>Content here</p>



table.myTable .col1 { vertical-align: top; width: 122px; }
table.myTable .col2 { vertical-align: top; width: 353px; padding-left: 5px; }

img.myImage { max-width: 122px; max-height: 172px; }
div.imageWrapper { width: 122px;  }

Comments (10) -

  • abhijeet

    5/13/2010 6:40:01 AM |

    Thank's John

  • Fast3r

    11/18/2010 4:57:27 AM |

    Thaks, this helped, I had exactly same problem.

  • Quen

    2/26/2011 9:13:24 PM |

    Thanks. Everywhere I looked no one knew a way to fix this problem. I even use this in the bbcode I wrote for my forums.
    Same thing you used just inserted into the preg_replace:

    $message = preg_replace("/\[img\](.+?)\[\/img\]/", "<div class='imageWrapper'><img src='$1' class='bbcode' /></div>", $message);

    So thanks a ton. This was above and beyond helpful.

    P.S. I truly hate catering to IE Tong

  • Dennis vd Hout

    5/23/2011 8:45:30 AM |

    Thanks so much!

    I have been using margin-left / margin-right to fix the space but it wont work if you dont know the original width of an image!

    Such an easy solution yet so effective!

    Thanks very very very much!


  • Suzette

    8/22/2011 2:23:10 PM |

    Thanks so much. Had exactly the same issue! All fixed now.

  • Grace

    10/6/2011 11:05:07 AM |

    I been working on it all yesterday with solutions to this issue from other blogs/pages... and yours worked out like a charm.


  • Chandu

    2/3/2012 4:16:32 AM |

    Thank you my issue solved

  • Ben Martin

    3/30/2012 2:00:25 PM |

    Thanks for this! It was driving me insane.

  • Alessandro Pagnin

    6/18/2012 4:52:34 AM |


  • Tarun

    8/3/2012 8:17:40 AM |

    Thanx John.!!!  Thanx a Lot..
    !!  I had the same problem.

Comments are closed