The problem I am having is best seen visually.
If you go to this page I created you can see I made an image map over a picture. Each arrow changes on hover, and if you click an arrow, it opens up the relevant blog post in the same page.
I am very satisfied with this, and was honestly pleased I figured it out, as I am very inexperienced with html/css/etc
THE PROBLEM: I made the coordinates of the image map off of the full size image, which is ~1650 x 950. It looked too compressed when I resized the original image to fit the theme (about 500 x 335)
Clearly the image is too big, off center, and doesnt fit in most browsers.
Any ideas on how I can keep the image map, hover, and pop up, while centering and resizing the image?
Is it possible to put this area map, with the clickable popup/image map I already made inside ANOTHER thickbox, such that when you click a 500 x 335 image that fits, it pops up the 1650 x 950 area map, with the hover and links?
I was unable to figure out how to do this, if it is even possible.
Any other solutions or ideas would be greatly appreciated.
Here is my code
**note Ive tried things like changing the width in the div style but that distorts the image crazily