Hover your mouse over the footnote numbers to reveal the hidden elements. Note that the positioning of the revealed elements CHANGES with serif (Times New Roman) vs sans-serif fonts (Lucida Grande). Set your font to a sans-serif font before testing, and then reload with a serif font. You may need to hit the refresh button more than once. Don't ask me why.
This paragraph uses a div class called "container" with a width setting of 300px:
Naming a product by committee is a dangerous thing. It tends to, but not always, lead to silly product names like "Entourage" and "Paint Shop Pro"[1][1] Paint Shop Pro comes out of this article as soon as my copy of Paint Shop Standard arrives.. I have the feeling GIMP was named on a mailing list.
This one uses "container2", whose only difference is NO width setting at all:
Naming a product by committee is a dangerous thing. It tends to, but not always, lead to silly product names like "Entourage" and "Paint Shop Pro"[1][1] Paint Shop Pro comes out of this article as soon as my copy of Paint Shop Standard arrives.. I have the feeling GIMP was named on a mailing list.
For future reference by scientists, here is an example of the original problem in action (footnotes are in various posts):
http://www.mikey-san.net/damage/broken_footnotes.html
This box uses "container", which has a defined width of 300px, but I've added "display: inline-block;" to the parent span of the hidden element. I'm pretty sure inline-block isn't necessary, but for some reason, Safari 1.3 doesn't behave without it.
Naming a product by committee is a dangerous thing. It tends to, but not always, lead to silly product names like "Entourage" and "Paint Shop Pro"[1][1] Paint Shop Pro comes out of this article as soon as my copy of Paint Shop Standard arrives.. I have the feeling GIMP was named on a mailing list.