I originally did this with images being floated but in IE I was getting this 1px separation between all the images for some reason. It seemed easier to use 1 image and throw an imagemap over it. Now I find out that in Safari the imagemap doesn't work. Only 6% of our traffic but that unfortunately includes or Executive VP's home computer. D'oh.
I cannot figure out why this wont work despite all my searching. Please help!
There are 4 images with imagemaps - all have unique IDs. There's lots of bonus code in there thanks to Sharepoint not caring about what I tell it.
http://www.worldvision.ca/About-Us/financial-information/Pages/2011-annual-report-focus.aspx
<img src="images/footer_focus_development.jpg" alt="" style="margin-left:-100px; margin-top:-5px; position:relative;" usemap="#imgmap2012127151844" border="0"/>
<map id="imgmap2012127151844">
<area shape="rect" alt="" title="" coords="403,197,482,215" href="http://childview.worldvision.ca/childview/en/?page_id=250p=1183" target="" />
<area shape="rect" alt="" title="" coords="446,431,531,447" href="http://childview.worldvision.ca/childview/en/?p=74" target="" />
Sorry to @moontear and thanks for the help. I managed to fix this but wasn't able to post the answer for 8 hours :(
So, turns out that you need to also specify the NAME attribute for the and not just an ID.
Silly!