How to make a whole 'div' clickable in html and css without JavaScript?

html css click
Andy Lobel picture Andy Lobel · Nov 17, 2011 · Viewed 439.6k times · Source

I want to make it so that a whole div is clickable and links to another page when clicked without JavaScript and with valid code/markup.

If I have this which is what I want the result to do - 

<a href="#">
<div>This is a link</div>
</a>

The W3C validator says that block elements shouldn't be placed inside an inline element. Is there a better way to do this?

Answer

Mario picture Mario · Jan 19, 2012

It is possible to make a link fill the entire div which gives the appearance of making the div clickable.

CSS:

Related questions

how to make div click-able?

<div><span>shanghai</span><span>male</span></div> For div like above,when mouse on,it should become cursor:pointer,and when clicked,fire a javascript function,how …

Read More
Add and remove a class on click using jQuery?

Please see this fiddle. I am trying to add and remove a class on li elements that are clicked. It is a menu and when one clicks on each li item I want it to gain the class and all …

Read More
How to horizontally center a <div>

How can I horizontally center a <div> within another <div> using CSS? <div id="outer"> <div id="inner">Foo foo</div> </div>

Read More