Make entire div clickable

Question

I am trying to get the whole div clickable and this works but only with a straight link to another site. Is there a way to make it work with this text in it also:

<div class='reddit' title='Share Us On Reddit' onclick="window.open('http://www.reddit.com/submit?url=httpsFwww.example.com&amp;title=XXX is Cape Breton's Homepage. Start Your Web Search With Beautiful Cape Breton Island')">

Thanks

score 3 · Answer 1 · edited Oct 17 '18 at 07:24

3

From CSS Tricks

This probably isn't a thing you need to rely on JavaScript for anymore. Since HTML5, this is perfectly valid:
<a href="http://example.com">
  <div>
     anything
  </div>
</a>
And remember you can make links display: block; so sometimes you don't even need the div.

edited Oct 17 '18 at 07:24

BSMP

4,596
8
33
44

answered May 22 '18 at 18:06

Milan Bastola

306
1
4
19

How could I do the same thing with the code below. Thanks..... – Laurie Williams May 22 '18 at 18:28
Create a jsfiddle. I suggest you to use instead of – Milan Bastola May 22 '18 at 18:36

sameer · Answer 2 · 2018-12-02T20:53:44.223

3

<div  style="cursor:pointer" onclick="document.location='evenidontknow-page.html'">
  <h2>Full Div Clickable</h2>
  </div

The above code helped me very well, and this will not require any extra code.

Using a tag may solve the problem but we need to add extra code to it.

please check this link for more info w3schools

edited Dec 02 '18 at 20:53

answered Dec 02 '18 at 20:28

sameer

443
4
9

score 2 · Answer 3 · answered Dec 19 '19 at 00:12

Bootstrap has a feature called "Stretched Link". From the documentation:

Make any HTML element or Bootstrap component clickable by “stretching” a nested link via CSS.

You can read more by visiting the following link:

https://getbootstrap.com/docs/4.4/utilities/stretched-link/

Make entire div clickable

3 Answers3