I need a little bit of help, I am using a CSS popup code and it renders in Mozilla Firefox, but not in IE. The site where I got the idea from works in both major browsers, and I cannot find the reason why mine does not.

CSS:
div#collections {
position:absolute;
left:25px;
top:106px;
font-family:Verdana, sans-serif;
font-size:11px;
}
div#collections a {
text-decoration:none;
color:#fff;
}
div#collections a:hover {
text-decoration:none;
color:#333;
}
div#collections a span {display: none;}
div#collections a:hover span {display: block;
position: absolute; top: 196px; left: -5px; width: 125px;
padding: 0px; margin: 0px; z-index: 1;
color: #000; background: #fff;
font: 11px Verdana, sans-serif; text-align: left;}
Body
<div id="collections">
- <a href="#">Necklaces
<span> Beautiful Necklaces</span></a><br>
- <a href="#">Bracelets
<span> Handcrafted Bracelets</span></a><br>
- <a href="#">Earrings
<span> Stunning Earrings</span></a>
</div>
The site that I got the idea from is http://www.meyerweb.com/eric/css/edge/popups/demo.html

If anyone can pick out my flaw in the coding, I would greatly appreciate it.
To view my page, go to http://smurf.r-x2.net/test/