Is there a way to convert an html element into a link using CSS?

Example:

I have a DIV element which has heading and paragraph and I would like to have the whole element with the child elements to be a clickable link without modifying the HTML dom with a href tags.

```
<div id="link-selector">
  <h2>Hello World</h2>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 
  </p>
</div>

```

CSS might look something like this (assuming there is a command similar to this)

```
#link-selector {
  make-link: true;
}

```

If I would be working with normal HTML, CSS and JQUERY project I would be using JQ with a code something like this:

```
$("#back-to-top").click(function() {
    $('html, body').animate({
        scrollTop: $("body").offset().top
    }, 1000);
});

```

But since I work with WordPress site I don't want to have JQUERY involved as it really looks to be PIA to have it work properly.

NOTE: The site that I'm talking about is <http://www.apc.fi/sivudata/kauppa/>. I need to have all those hexagons a clickable link that will take the user to a product page.