Twice now I’ve run across a problem with Internet Explorer 7 (and sometimes 8) having problems redrawing HTML when modifying the class on an element that contains several children. Usually I’m trying to swap a class to apply styles for a “grid view” of products or a “list view” of products. The simplest solution I’ve found is mentioned in the comments of an Ajaxian post. Here is the simple solution using jQuery (not that it matters; we had the selector already cached in my situation):
You grab the element, hide it, access its offset (while hidden), then restore it. I’m guessing this forces IE7 to re-calculate the offset when the item is hidden, even though you store the value and never use it, then making it visible again causes it to redraw properly. A wild guess, but these few lines work nonetheless.