Block-Element als Link

From everyday web design: To make an entire block element (e.g. the div element) clickable, it is normally sufficient to place a hyperlink tag (<a></a>) over the block element,

i.e. set the width and height properties of the hyperlink tag to 100%, set "position" to "absolute", and set "left" and "top" to 0 (the parent element's "position" property should not be "static"). This method works wonderfully in all common browsers – but only to a limited extent in Internet Explorer. In IE, areas can appear that are excluded from the link when the mouse is moved over them. The following workaround helps: Before placing the hyperlink tag over the block element, we cover the block element to be linked with another block element and give it a transparent background image (background-image). This also prevents any problems in IE.

... back to the blog