rules/border between cells

admin · Jan 9, 2008

I've been fighting with this one for a little bit... I had been hoping to drop the idea but... the website owner 'really' would like a horizontal rule (border) between cells on a table (2 col x 6 rows). So that means bottom of Row1 to Row5 but not the bottom of Row6 
 
Page is located at: 
 
<a class="postlink" href="http://www3.sympatico.ca/zimber/Services.htm">http://www3.sympatico.ca/zimber/Services.htm</a> 
 
I've tried many different 'supposed' solutions, referenced what I can find on borders in tables but none seem to work completely properly. 
 
Looking forward to the answers as I had great help on my last question. 
 
p.s. please be easy on me about my coding... lol this is a cobbling together of FrontPage and my own code. I realize it isn't very concise.... yet!Not sure I understand completely but have you tried CSS? 
 
Put: style="border-bottom: 1px solid #000; in the td you want the line!?You mean like putting in a horizontal rule <hr> between the rows? Just put that tag after every table row </tr> that you want the rule to appear. 
It will add a space as well, and there are more complex and better ways to do it without adding any space using CSS.I believe I tried the 'border-bottom' as well as rules='rows' - I think either were cross browser compatible. 
 
I first went to <hr> but it made too much space on the page and didn't look good visually. 
 
However, I might revisit the border-bottom via CSS...never heard of rules="rows" bit. 
 
if you use <hr> then jsut take the margins out 
 
<hr style="margins: 0px"> 
 
or 
 
<hr style="display: inline">Hmmm - poked around with 'margin' style and got exactly no where... 
 
But I found a really neat way to put the lines in that ought to be cross browser compliant and it is soooo neat.. For example: 
 
<tr> 
<td>Lessons</td> 
<td>Let Shadow Productions provide a visual record of your lesson with your favourite coach.</td> 
</tr> 
<tr> 
<td style="font-size:1pt" bgcolor="#808080"> </td> 
<td style="font-size:1pt" bgcolor="#808080"> </td> 
</tr> 
 
<tr> 
<td>Shows</td> 
<td>Shadow Productions has a comprehensive list of competitions Diana will be attending. 
<a href=http://www.htmlforums.com/archive/index.php/"Schedule.htm">2003 Schedule</a></td> 
</tr> 
<tr> 
<td style="font-size:1pt" bgcolor="#808080"> </td> 
<td style="font-size:1pt" bgcolor="#808080"> </td> 
</tr><td style="font-size:1pt" bgcolor="#808080"> </td> 
that is doing nothing. the font style is not needed if you don't use a font, and using a tag is the sasme heigth as a <hr> tag, thy both are block level elements. again taking the margins out will make them smaller.Try this on for size... 
 
<table border="1" width="600" frame="void" rules="rows"> 
<tr> 
<td>cell 1-1</td> 
<td>cell 1-2</td> 
</tr> 
<tr> 
<td>cell 2-1</td> 
<td>cell 2-2</td> 
</tr> 
<tr> 
<td>cell 3-1</td> 
<td>cell 3-2</td> 
</tr> 
<tr> 
<td>cell 4-1</td> 
<td>cell 4-2</td> 
</tr> 
<tr> 
<td>cell 5-1</td> 
<td>cell 5-2</td> 
</tr> 
<tr> 
<td>cell 6-1</td> 
<td>cell 6-2</td> 
</tr> 
</table> 
 
Here's a reference for you... (click) (<a class="postlink" href="http://www.htmlite.com/lite039.php">http://www.htmlite.com/lite039.php</a>)the only browser tha tlooks good in <htmlite> is NS6+, not IE as it looks like crap.The reason the 'font-size:1pt' works is because it sets the cell up for a small line height which when the bg colour is turned on gives the illusion of a line that is thin. 
 
I have had NO luck using margin attibutes nor using 'frames=' and 'rules='. 
 
Scoutt - If you can give it a stab and provide code, I am certainly willing to try it.Originally posted by scoutt 
if you use <hr> then jsut take the margins out 
 
<hr style="margins: 0px"> 
 
or 
 
<hr style="display: inline"> 
I already showed you. just put that in between the tablesI did try what you had posted but it got me no where. 
 
Perhaps what I'll do is republish the page with all the variations of what I tried with "margin: 0px" and see if you can see what stops it from working. 
 
I couldn't find any references to 'display: inline' 
 
When I tried it the first time, if I put <hr style="margins: 0px"> any where in the <td> it would sort of work but not consistently between col 1 and col 2. If I put the <hr style="margins: 0px"> with the <tr> tag then I only got one line at the very top of row 1 regardless of where I placed the hr tag (ie I tried it in row 6 and it still gave me a hr at the top of row 1.)

so go figure.. It sounds like a very elegant solution - to which I am partial - I don't like BF&I solutions but I am learning that sometimes the elegance ideas just don't work! 
 
Thanks for your quick response, Scoutt

Here is a link to the page - lol - it looks worse than in my editor..

If you havd a chance can you take a look and see if I am severely missing something. 
 
<a class="postlink" href="http://www3.sympatico.ca/zimber/ServicesA.htm">http://www3.sympatico.ca/zimber/ServicesA.htm</a>the reason it is not working is you have this 
<hr style="margins: 0px"> 
 
in a cell, it has to go after the closing table tag to work. I thought you wanted a rule after each table?symantics, eh..

I want a rule after each row. Not the table itself.. 
 
So that is probably why <hr> won't work... which means I am probably stuck with the BF&I that does work. 
 
Thanks for clarifying...ahh I see, well then yeah your way is probably the best. good luck.

have you tried the border-bottom?! Kinda like this (<a class="postlink" href="http://www.inkreations.com/v3/shadow.htm">http://www.inkreations.com/v3/shadow.htm</a>)?Putting <hr> after each row was a good idea, but is not allowed. No other tags are allowed between <table> and <tr> or between <tr> and <td>, or between </tr> and <tr>, or between </td> and <td>, likewise the same with the closing tag pairs </td> and </tr> and the end of the table with </tr> and </table>.

rules/border between cells

admin

Administrator