CSS - auto look up box in tool bar

[stn003]

Hi,

Ok firstly i am not even sure that this is possible, but thought i would ask anyway.

I have started building a toolbar using conduit and one of the features they have is you can include pages from your website, so i have put together a single text field as a seach facility that has an auto look up facility so that when somebody types in to the search field a drop down box displays below the search field with matching products from my database.

Now this works fine as a webpage, the only problem is when i include that page in to the tool bar ( through some form of iframe or something along those lines)
The drop down box seems to drop down behind my browser pages.

I guess my first question is, is it actually possible to get the drop down box to appear on top of the browser pages.

And if so what would i need to modify here to make it work.

.suggestionsBox {
		position: absolute;
		left: 30px;
		margin: 10px 0px 0px 0px;
		width: 200px;
		background-color: #212427;
		-moz-border-radius: 7px;
		-webkit-border-radius: 7px;
		border: 2px solid #000;	
		color: #fff;
	}
	
	.suggestionList {
		margin: 0px;
		padding: 0px;
	}
	
	.suggestionList li {
		
		margin: 0px 0px 3px 0px;
		padding: 3px;
		cursor: pointer;
	}
	
	.suggestionList li:hover {
		background-color: #659CD8;
	}

Any help wpuld be appreciated.

Stn

[lohumihem]

Assuming you want to put your dropdown div on the top of the layer so the css would be

.dropdown{
position:absolute or relative;/* change as u want, they are totaly different*/
z-index:999/* you can change the value*/
}

it'd be great if u can post you code or a link




}

[stn003]

Hi Sorry,

The drop down box as i keep calling it is actually called suggestion box in the code posted previously.

[stn003]

Also i can'really supply a link as it for a tollbar however the code for the page is:

http://www.pestcontrolonline.com/toolbar/toolbar.php which works fine, it's just when it is used in the toolbar the suggestion box doesn't sit on top of the browser pages and disapears behind them.

Thanks

Stn

[lohumihem]

.suggestionsBox {
position: absolute;
left: 30px;
margin: 10px 0px 0px 0px;
width: 200px;
background-color: #212427;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border: 2px solid #000;
color: #fff;
z-index:999999;

}