lucy24 - 8:08 pm on May 24, 2011 (gmt 0)
You can also put a border on the div just to see what's happening.
Funny you should say that, because a colored border is one of my standard debugging tools and was one of the first things I tried here ;)
It confirms what I see without the margin: the non-floating version (minus the background-attachment) has created a top margin that invisibly contains most of the graphic, even though I've explicitly told everything to have no top margin. Exact same behavior in all browsers (three families, don't have MSIE but I assume OP does).
Stop the presses. Entity, how big is your own graphic? I made mine taller, and discovered that the mysterious top margin-- the one that eats the image-- has nothing to do with the size of the graphic. It's at a self-determined 1/2 em. If the graphic is fatter, most of it is visible. Again, same behavior in all browsers and where the ### does Opera hide its "recent items" list?