HTML-CSS - custom div popup on hover not appearing once the code is put inside of a div

HTML-CSS - custom div popup on hover not appearing once the code is put
inside of a div

I have some code that spawns a popup (created in a div) when the user
hovers over an image. But once i put this code into a div, the pop up no
longer appears.
Working HTML:
<a href="somelink" id="wellsButton" >
<img style="float:left; padding:8px 0px 41px 7px;"
src="buttons/wells_text.png" >
</a>
Broken HTML:
<div id="tabs" style="width:100%">
<a href="somelink" id="wellsButton" >
<img style="float:left; padding:8px 0px 41px 7px;"
src="buttons/wells_text.png" >
</a>
</div>
CSS Code:
#wellsFilter
{
display:none;
position:absolute;
left:980px;
top:35px;
background-color:#e5e5e5;
border:1px solid #828282;
padding: 0 10px 10px 10px;
_padding-top: 10px; /*for IE only*/
_padding-bottom: 10px; /*for IE only*/
/*width:230px;*/
opacity:0.93;
filter:alpha(opacity=93); /* For IE8 and earlier */
z-index: 1000000000; /* Be on top of splitter */
}
#wellsFilter img
{
float:left;
}
#wellsFilter label
{
float:left;
margin-left: 10px;
}
#wellsFilter input
{
margin: 0 0 0 10px;
}
#wellsFilter .toolheader
{
margin-right: 20px;
}
#wellsButton:hover + #wellsFilter
{
display:block;
}
#wellsFilter:hover
{
display:block;
}
Why does my popup stop working as soon as the elements are within a parent
div container? I have tried a wide variety of padding and absolute value
settings, but nothing has worked.
EDIT - Removing the javascript links as people thought they were the issue.