Recently, Chrome went to 14 and many people got background updates to it. Turns out that in Chrome 13, rendering of -webkit-transforms changed handling of z-index's. Well, that means a Toaster that isn't webkit-transform'd and has a background suddenly pops up on top of anything that is webkit-transformed, such as VirtualLists.

There are a bunch of topics all over talking about VirtualLists and Toasters having trouble, and I didn't actually diagnose this problem directly. Instead, I had text that was transformed in my Toaster and suddenly it was showing up behind it. Once I figured out the rendering change I mentioned above, I just added a transform to the parent of my text and everything came back.

In the forums, [unwiredben] explained how to do it at a framework standpoint. Simply replace all CSS rules that say

-webkit-transform-style: preserve-3d;

with

-webkit-transform: translateZ(0);

And that's it! VirtualLists and other webkit transformed kinds and dom elements will show up properly!