Linking a div without javascript?

Question

It's a very simple question, you may say that i can do this:

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

but when i hover the div (110x74)px it hovers all across the width of the page, as if the div has a width of 100%, so when i click on blank part of the page it acts like if there's a link there, ideas? thanks

I also tried with javascript and it worked but many smartphones can't support it.

Answer 1

don't know what you want exactly? this JSFiddle shows a DIV with the given dimensions and it works as you require... you might want to elaborate some more on what it is you're looking for...

CSS:

.test{
    width: 110px;
    display: block;
}

.test div{
    height: 74px;
    border: 1px solid black;
}

HTML:

<a href='#' class='test'><div></div></a>

Answer 2

http://jsfiddle.net/nNA7G/7/

HTML:

<a href="stackoverflow.com"><div><p>hi lol</p></div></a>

CSS:

a
{
    width: 100px;
    height: auto;
}

div
{
    width: 80px;
    background-color: khaki;
}

Answer 3

if I understand you problem -since my english language is week-, I think if you set wrapper for link and set link as diplay: inline-block .. the width will be exactly, and you can increase width any time as block ..

use display block or inline-block will resolved width problem ...

good luck, and sorry if not that what you mean ..

Good luck mate ^^