I was experiencing this vexing problem with my image "box" script of choice, namely Fancybox. I got it working and made it play nicley with MaxiGallery as the image uploader etc. The problem was that both IE6 and IE7 would not display all the dropshadow graphics around the fullsize images. It would dispaly like half of them which made for a very ulgy effect.
This simply drove me nuts so I decided to make a super simple static test site to see if I could trigger the same issue. It did. The probelm was still there in IE, but the other browsers had no problem. I could just not figure this out.
In frustration I joined the Google jQuery Groups list but found no answers after several days. Then all of a sudden I received an email from the FancyBox author in Latvia with the solution...
Turns out the FancyBox CSS was picking up the body{ text-align: center} declaration I had in my main page layout CSS. I am in the habit of centering my layouts using the text-align: center for the body and using {margin:0 auto; text-align:left} for the page wrapper. This is a common method and it takes care of the IE6 page centering gotcha.
I then used the Firefox Firebug to see what the overall container div was for the plugin (its not there in the Fancybox CSS file). In the end all I had to do was add #fancy_wrap {text-align:left;} to the Fancybox CSS file and that seems to take care of the problem.
In a million years I doubt I would have thought of this on my own though. Its just one of those IE CSS gotchas that can drive you insane.
Max
