Hello

I would like a DIV which has a text link in to change background color when the mouse enters the DIV (not just when the text is hover over.

The entire DIV would become a link, not just the text.

Any ideas? I've google'd it but not sure what to look for.

Thanks

Well, you can do it, but it won't work in IE6 or below because it doesn't support hover on anything except the <a> tag. In GOOD browsers, this would work:

#box1{
width: 400px;
height: 200px;
background: pink;
margin: 0 auto;
}

#box1:hover{
background: lime;
}

To make IE work you need some Javascript - do a search for whatever:hover

Thanks.

That is making the DIV background change color which is good.

But is it possible to make the whole DIV a link?

So like this? It's not exactly making the div a link, but it's giving the fake impression....

.hover a {
padding: 10px;
text-decoration: none;
color: #000;
}
.hover a:hover {
padding: 10px;
background: lime;
}

<div class="hover">
<a href="#">hover</a>
</div>

- Steve

You cannot put a block-level div inside an inline element (the <a>), so no, you can't really make a div a link.

Make the <a> into a block element (display:block) give it 100% height and the anchor element will fill the div