Cell as Hyperlink

[[lhomme]]

Is there any way I can make an entire cell a hyperlink? (Without using images?) Thanks.

[Bruce]

<td width="100%" height="50" onMouseOver=this.style.backgroundColor="#FFFFFF" onMouseOut=this.style.backgroundColor="" onclick="window.location.href='http://yahoo.com'">

Of course you can edit it to suit your needs.

[[lhomme]]

Thanks for the quick reply.

[[lhomme]]

On a related note, is there a way to do:

width="100%" height="50" onMouseOver=this.style.backgroundColor="#FFFFFF" onMouseOut=this.style.backgroundColor=""

by using CSS? If so, does what is a good tutorial for it?

[meow]

In theory yes, in pracice no, not without javascript.

But it depends on what you want to do. Is it like a big TD with a lot of content or are you just trying to create a menu with ordinary links in cells and want the whole cell to highlight? In the latter case it's doable.

[[lhomme]]

I'm want to use a table cell as a single link, with any part of the cell to be clickable. The cell would also change color on mouseover. Phrozen's coding does this.

What I want however, is to skip having to put:

width="100%" height="50" onMouseOver=this.style.backgroundColor="#FFFFFF" onMouseOut=this.style.backgroundColor=""

on every <td> tag and have a single thing that edits them all. Any suggestions?

[meow]

Well, your original question if it can be done with CSS - it still depends on what you have in there.

[[lhomme]]

If you are referring to whats in the cell - 1 to 2 words.

[meow]

Point was if there's something else than the link and in that case what. See two posts up.

If no, this will do it (fill in the other links states, colors and so on).

<style type="text/css">
<!--
#foo a { display: block; height: 100% }
#foo a:hover { background: #ff0000 }
-->
</style>



<table id="foo" border="1">
<tr>
<td width="150" height="50">
<a href="http://www.example.com">Yadda yadda</a>
</td>
<tr>
<td height="50">
<a href="http://www.example.com">Yadda yadda</a>
</td></tr></table>

Use "class" instead of "id" if you need it to work with more than one table.

[[lhomme]]

I should have done this earlier: http://www.acafe.net/acafe/

If you check in the source code - the <td> tags in the nav menu are loaded with repetitive code I want removed using CSS. Thanks for your help.

Btw - I'm just experimenting with a new design so it looks really bad.

[meow]

I suspected this was what you were doing. Does it work?