I have this DIV in the top left corner of my page. How can I make an anchor that fills this div?

Question

#mydiv {
position:absolute;
left:0px;
top:0px;
width:83px;
height:83px;
}

<div id="mydiv"></div>

That's my style for my DIV, which sits on the top left corner of my page. I want this div to be click-able and go to a link.

Answer 1

#mydiv {
position:absolute;
left:0px;
top:0px;
width:83px;
height:83px;
}
#mydiv a
{
 display block;
 width:83px;
 height:83px;
}
<div id="mydiv"><a href="a">link</a></div>

Answer 2

You may be interested in checking out the following article, for a brief explanation and a working example:

• Filling a block level element with an anchor

Answer 3

There's 2 ways to do this. The first, and easiest, would be to just wrap your div with an anchor (<a style="border: 0;" href="...">) tag.

Or you can use css/javascript by adding an event listener to the div and adding a css pointer to it as well:

<div onclick="window.open(http...)" style="pointer: cursor;" >...</div>