Works fine in the latest Safari on Tiger:

While, interestingly enough, it doesn’t even change sizes in the still webfont-incapable Camino:

Because that’s CSS3:

li:nth-child(29) {
font-size: 36px;
}

Otherwise I had to write li + li + li …

My consideration was, that probably all webfont-capable browsers understand that CSS3 rule.

I only know a bit Javascript. More to the point, I already have forgotten the most, that I did know about Javascript, and I never did know much about Javascript. It would be better to change the class of the waterfall-ul by clicking on the items of the style list at the top instad of repeating the code of the waterfall in the markup. And the font-sizes of each li-tag also should be changed with Javascript. That would be much more elegant and additionally it would reduce the file-size, which already is relatively small.

Works fine in the latest Safari on Tiger

But that’s not Delicious in your screenshot of Safari.

@Arno

You're advanced in CSS and HTML and very, very and very intelligent. :-D

Out of my blog, I edited your Delicious test HTML, I saved, I tested and it worked perfectly, but it doesn't work in my blog because I put the six fonts groups on after the code "body" as you put them on after the code "body".

I'll begin to study Html and CSS for discovering the secret.

But that’s not Delicious in your screenshot of Safari.

Woops!
Of course you’re right, and I will now hide in shame.