Nested hyperlinked areas without nested link elements in HTML source

Question

I\'d like to have something that looks and behaves as hyperlink inside larger rectangle (full page wide) which is also hyperlink. Below there is ASCII-art representation of what

Answer 1

What I have done in the past is use Javascript to attach the proper functionality to the div (assuming that is the parent element) so that when it is clicked, window.location is ran opening the .href attribute of the child link.

Something like this perhaps.

// jQuery Code
$(".parentDivLink").click(function(){
  window.location = $(this).find("a.mainLink").attr("href");
});


  Click Me