Warning, dumb question! Making table cells into hyperlinks?

  • Thread starter Thread starter Guest
  • Start date Start date
G

Guest

It must be staring me in the face but I'm pretty stuck with this...

How can I turn a cell into a hyperlink? I want to convert the cell as a
whole into the hyperlink and not just the text within the cell. (Purpose is
to create a calendar with links to individual diary entries, on my site
www.aaltenvoogd.com)

Many thanks in advance for your help.

Stefan
 
You don't want to do that in the way that I *KNOW* you are thinking. 8)

Show me an example of your table code, containing a cell that you want to be
a link, and some context, please.
 
Hi Stefan,

You'd want something like this -
<style type="text/css">
#calender td a{
position:relative;
display:block;
}
</style>
<table id="calender">
<tr><td><a href="page.htm">This Cell is a Link</a></td></tr>

Add whatever other styles (fonts, colors etc) you want to #calender td a
 
Hmmm... I don't tend to look at the scary HTML and instead edit pages in
FP2003's Design mode (I know, I know...)

But below is a snippet of what I have at the moment (without any links).

Looks like an awful lot of code for a very simple task... I look forward to
finding out what the "correct" way of doing this should be! :-)

===== 8< ===== 8< =====

<p align="justify" style="margin-top: 0; margin-bottom: 0">
</p>
<table border="0" cellpadding="0" cellspacing="1" style="border-collapse:
collapse" id="table1" bordercolorlight="#FBE1C5" bordercolordark="#EDA071">
<tr>
<td width="36" align="center" height="24" style="color: #333333">
</td>
<td width="36" align="center" height="24" bgcolor="#FFFFFF"
style="color: #333333">
<p style="margin-top: 0; margin-bottom: 0">
Mon</td>
<td width="36" align="center" height="24" bgcolor="#FFFFFF"
style="color: #333333">
<p style="margin-top: 0; margin-bottom: 0">
Tue</td>
<td width="36" align="center" height="24" bgcolor="#FFFFFF"
style="color: #333333">
<p style="margin-top: 0; margin-bottom: 0">
Wed</td>
<td width="36" align="center" height="24" bgcolor="#FFFFFF"
style="color: #333333">
<p style="margin-top: 0; margin-bottom: 0">
Thu</td>
<td width="36" align="center" height="24" bgcolor="#FFFFFF"
style="color: #333333">
<p style="margin-top: 0; margin-bottom: 0">
Fri</td>
<td width="36" align="center" height="24" bgcolor="#FFFFFF"
style="color: #333333">
<p style="margin-top: 0; margin-bottom: 0">
Sat</td>
<td width="36" align="center" height="24" bgcolor="#FFFFFF"
style="color: #333333">
Sun</td>
<td width="36" align="center" height="24" bgcolor="#FFFFFF"
style="color: #333333">
Mon</td>
<td width="36" align="center" height="24" bgcolor="#FFFFFF"
style="color: #333333">
Tue</td>
<td width="36" align="center" height="24" bgcolor="#FFFFFF"
style="color: #333333">
Wed</td>
<td width="36" align="center" height="24" bgcolor="#FFFFFF"
style="color: #333333">
Thu</td>
<td width="36" align="center" height="24" bgcolor="#FFFFFF"
style="color: #333333">
Fri</td>
<td width="36" align="center" height="24" bgcolor="#FFFFFF"
style="color: #333333">
Sat</td>
<td width="36" align="center" height="24" bgcolor="#FFFFFF"
style="color: #333333">
<p style="margin-top: 0; margin-bottom: 0">Sun</td>
<td width="36" align="center" height="24" style="color: #333333">
</td>
</tr>
<tr>
<td width="36" align="center" height="24" style="color: #333333">
May</td>
<td width="36" align="center" bgcolor="#677EA4" height="24"
style="color: #333333">
<b>23</b></td>
<td width="36" align="center" bgcolor="#677EA4" height="24"
style="color: #333333">
<b>24</b></td>
<td width="36" align="center" bgcolor="#677EA4" height="24"
style="color: #333333">
<b>25</b></td>
<td width="36" align="center" bgcolor="#677EA4" height="24"
style="color: #333333">
<b>26</b></td>
<td width="36" align="center" bgcolor="#677EA4" height="24"
style="color: #333333">
<b>27</b></td>
<td width="36" align="center" bgcolor="#677EA4" height="24"
style="color: #333333">
<b>28</b></td>
<td width="36" align="center" height="24" bgcolor="#677EA4"
style="color: #333333">
<b>29</b></td>
<td width="36" align="center" height="24" bgcolor="#677EA4"
style="color: #333333">
<b>30</b></td>
<td width="36" align="center" height="24" bgcolor="#677EA4"
style="color: #333333">
<b>31</b></td>
<td width="36" align="center" height="24" bgcolor="#324E80"
style="color: #333333">
<b>1</b></td>
<td width="36" align="center" height="24" bgcolor="#324E80"
style="color: #333333">
<b>2</b></td>
<td width="36" align="center" height="24" bgcolor="#324E80"
style="color: #333333">
<b>3</b></td>
<td width="36" align="center" height="24" bgcolor="#324E80"
style="color: #333333">
<b>4</b></td>
<td width="36" align="center" height="24" bgcolor="#324E80"
style="color: #333333">
<b>5</b></td>
<td width="36" align="center" height="48" style="color: #333333"
rowspan="2">
Jun</td>
</tr>


===== 8< ===== 8< =====
 
Assuming you want to add a link to the 24th, I'd do it this way -

Add this CSS to the head of the page -

<style type="text/css">
#table1 td a{
display:block;
}
</style>

and change the code for the 24th from this -

<td width="36" align="center" bgcolor="#677EA4" height="24"
style="color: #333333">
<b>24</b></td>

to this -

<td width="36" align="center" bgcolor="#677EA4" height="24"
style="color: #333333">
<b><a href="whatever.html">24</a></b></td>

But that does involve either navigation through the multiple CSS menu levels
in FP, or getting your pinkies into the code.
 
That did the trick, many thanks!

Jon Spivey said:
Hi Stefan,

You'd want something like this -
<style type="text/css">
#calender td a{
position:relative;
display:block;
}
</style>
<table id="calender">
<tr><td><a href="page.htm">This Cell is a Link</a></td></tr>

Add whatever other styles (fonts, colors etc) you want to #calender td a
Click to expand...
 
Back
Top