The parts of the image behave like div HTML CSS

I would like to design some sort of a map, of a country, in which every state behaves as a different 'div'. Then I would link different pages to each of the states. But the borders of the state are not square/rectangle/any_regular_shape. The borders are complex shapes. How do I go about doing this? Even though I break them in Photoshop, how do I recombine them perfectly in CSS?

Thank you!

You want something like this map, you should go for SVG and maybe RaphaelJS is a good start.