Page 1 of 1

Image maps in CSS

Posted: Mon Dec 16, 2013 11:28 am
by Cherri
Is it possible to do image mapping in CSS? I know it's possible to do a lot of things in CSS. So I was curious about Image Maps. Or is it just better to do that in the html?

Re: Image maps in CSS

Posted: Mon Dec 16, 2013 12:11 pm
by dubiousdisc
It's not called image mapping, but you can achieve a similar effect by just styling <a> tags to be block-level elements (display: block) and then positioning them over the picture you have. I have a live example of that here, feel free to pick at the code if you want. As you can see, it doesn't even have to be all rectangles anymore - as of now, almost everything supports border-radius so you can have the area be a rounded rectangle or a circle too, and with CSS3 transforms you can do a lot of things!

Re: Image maps in CSS

Posted: Sat Dec 21, 2013 11:39 am
by Cherri
Thank you Dubs. CSS sure has come a long way. ^-^ I'll check the coding out!