Make a Div into a link

Im looking to how to do this , and nothing i try can get it accomplished.

Ive googled everywhere I found this link and a person's solution got praises but I dont know how to implement it, he explains it but I the type to need to see and example and i can work from their.

heres his sollution

source


If anyone can write this out please, sorry but im a noob to this. as always I thanks you guys for the help

 

basic:

this is all you need to make a link of a div.

 

that doesnt work the link and the div is offset

 

Note that is invalid HTML 4.01 but IS valid in HTML5 only.

 

You can use element properties and events such as mouse hover and mouse click to implement anchor style div.

 

<div onclick="window.location = 'HREF'">here</div> ?

 

A div is a block element - you can't make it a non-block (not offset) element. That throws a lot of beginners, trying to get 2 divs right next to each other. Just take out the div tags and make the content of the div the text in your link.

 

That is a quick solution... Also, you can style the link with <span> <p> or other tags.

 

The easiest way is to make the link fill the whole div - it's an inline element so you've got to overwride that with CSS. Here's a quick example:

<div class="someClass"><a href="home.html" style="display: block;">Look! the whole div is clickable now!</a></div>

Code (markup):

It's the

 style="display: block;"

Code (markup):

That makes it fill the entire width of it's parent but you'll have to put all of the divs content inside the link otherwise they wont be clickable. You could add something like this to your CSS too:

.linkFillParent { display: block; }

Code (markup):

So if you want to make a link fill it's parent in future, all you have to do is add

class="linkFillParent"

Code (markup):

to your links

You can also do stuff in css like:

.linkFillParent#hover { background-color: #some-hex; }

Code (markup):

to change the background colour of the div. if the div has any padding or anything you can just add a #hover attribute to the parent id/class

 

iyou can run it....
<a href=""><div>your text</div></a>

 

Simple, But Requires JavaScript Enabled

<div onclick="window.location='http:// your link goes here'"> Hello im a 300X300 Div Click me </div>

 

actually w3c will not support your idea. its a wrong coding style.

 

< href="link" ><div>your Text</div></a>