HTML/CSS - Several links on a single image

December 2016

Issue


I have an image for a menu ( a rectangle in my case) and I would like to add several links on it:
  • Title1 (towards page 1)
  • Title2 (towards page 2)
  • etc ...

All on a single image.

Solution


Try to put each image in the CSS.
/* Image for the index menu*/
.image-menu1 {
	background:url(index.png);
	width:100px;
	height:100px;
}

Once you got this right, create an html link and div of class.

Thanks to MastercroW for this tip.

Related :

This document entitled « HTML/CSS - Several links on a single image » from CCM (ccm.net) is made available under the Creative Commons license. You can copy, modify copies of this page, under the conditions stipulated by the license, as this note appears clearly.