building a digital map with css

[malibujamba]

Hello,I am buliding a digital map with the help of css. The basic idea is that when you move your mouse to one of the marks on the map a window with information about that mark appears.Now first it only worked in firefox but after some thinking I also got it working in IE7. But when I last week tried it in IE6 it didn't worked. Maybe someone of you people see's the problem? I can't find it yet realy.Here's the html:

<div id="map">	<ul>		<li class="object1"><a href="#"><img src="mark.gig" /></a>			<ul>				<li>information about object1</li>			</ul>				</li>				<li class="object2"><a href="#"><img src="mark.gif" /></a>			<ul>				<li>information about object2</li>			</ul>				</li>	</ul></div>

and here the css:

/*Map*/#map {	position: absolute;	width: 750px;	height: 500px;	background-image: url("map.jpg");}.object1 {	position: absolute;	margin-left: 60px;	margin-top: 260px;	width: 20px;	height: 20px;}#map ul li.object1 ul{	margin-left: -10000px;}.object1 ul li {	background-image: url("objectbackground.jpg");	width: 200px;	height: 300px;}#map ul li.object1:hover ul {	margin-left: 20px;	margin-top: -302px;}.object2 {	position: absolute;	margin-left: 400px;	margin-top: 123px;	width: 20px;	height: 20px;}#map ul li.object2 ul{	margin-left: -10000px;}.object2 ul li {	background-image: url("objectbackground.jpg");	width: 200px;	height: 300px;}#map ul li.object2:hover ul {	margin-left: -200px;	margin-top: -22px;}

[Ingolme]

I think that Internet Explorer 6 only accepts the :hover pseudo-class on A elements.

[malibujamba]

thnx I didn't know this. Now I know the problem I am goingt to try to solve it.

[S@m]

Correct, you will just have to be clever on how you can put your background images and such within the anchor tag.For example:

ul#map a#yourID {background:url(image.jpg);}ul#map a#yourID:hover {background:url(image.jpg);}

hope that helps!

[jlhaslip]

try this link

[malibujamba]

hello again,I was verry bussy last days/weeks. but latetly I started working on my digital map again. After you people told me what te problem was. I went looking on the internet. Finaly I found this peace of java script: http://www.naarvoren.nl/artikel/hover/csshover.htc wich takes care of the people who are using internet explorer 6 (and probably lower, but I can't test that). You have to include the document into your css like this:

body {	behavior: url("csshover.htc");}

Before getting bussy I have read this article http://www.naarvoren.nl/artikel/hover/ (it's in dutch to bad:) ).anyways. thanx for putting me on the right track.