CSS image map

[Chris]

I'm going to be making a CSS image map for a site. This is a system that functions just like an HTML image map but uses CSS to put active spaces on top of an image using absolute positioning.

I'm not a CSS ninja so I wanted to get some clarification on this.

Is absolute positioning always from the window boundaries, or can it be from within a div, or is that relative positioning?

So if I put the image as the BG of a div, then put my CSS links in the div, I'd need to use position: relative or position: absolute if I wanted to do the positioning based on pixels in the image, as opposed to pixels on the screen.

Then, with positioning, what part are you positioning? Do I give the position of the top left corner, or the center?

[deronsizemore]

Absolute positioning is always from within the window boundaries unless the item you're positioning is in side of another parent container.

Here is a link I dug out of my bookmarks that may help? http://www.webreference.com/html/tutorial18/1.html#SUBHEAD-1

[Chris]

I'm done with this... but I did run into 1 issue.

Firefox cannot handle a css file with a query string. With 300+ individual dynamic definitions making the css imagemap I figured it called for a separate file. So I made a css file, used ForceType to have it processed for PHP, and put the PHP code in it to take a query string and generate the right CSS.

Worked great... in IE. firefox would balk at the query string (and yes, I figured out it WAS the query string, I copied the output and put it in a file without a query string and it worked fine). PITA.

So I have to echo all the CSS definitions on the page.