A web page can be considered as being built on layers, the first being the base, or blank page, usually white but it can be given a colour. For my new site I have put another, slightly smaller, background layer on top, followed by the data and images. In my case I consider the nav bars as being a new layer since the drop-downs must sit on top of any data and images. One point about images, IE6, and earlier, do not recognise the ".png" transparency. Google will find many scripts to cure this, one of which is to be found here.
To make them display on top of images is easy, simply use the "z-index" CSS style. However for other image forms it can be quite tricky. For Flash, within the "Object" tag the line < param name="wmode" value="transparent" > needs to be included. IFrames present a different problem, and to date, despite having tested varying "solutions", I have yet to find a way of stopping the nav bars from going behind the image for IE7 and earlier. Still, I've three weeks left!
Now, the above are the easy problems, again it is IE6 which causes the real head ache, because CSS drop-down menus simply do not work! To the rescue comes Suckerfish and the Sons of Suckerfish, which for my purposes I had to modify even further.
My final point concerns testing, I use Firefox for most of my development work and test in IE8, Opera, Safari, Chrome, Sea Monkey and Bing, these I have on my PC. As I do not have a Mac. I rather hope that if it works with Safari it will be OK (not really satisfactory, but there we go!). So how do I test in earlier versions of IE? A nice free piece of kit called IE Tester enables this to be acheived.; although still in Alpha version, and not every bit works fully, it does do the job, and for me is a life saver.
© Ron Ferguson 2010