Welcome to WebmasterWorld Guest from 54.205.115.177

Forum Moderators: not2easy

Message Too Old, No Replies

borders

using CSS to apply a border to table rows...

   
9:24 am on Aug 24, 2001 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Does anybody know of a way to apply a border to a whole table row without applying a class to every cell (with a different one to each end to 'close the box').

Tried allsorts but can't seem to crack it.

11:55 am on Aug 25, 2001 (gmt 0)

WebmasterWorld Administrator brett_tabke is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month



Umm, would a table within the table work? Then apply the class to the inner table.
7:57 pm on Aug 25, 2001 (gmt 0)

WebmasterWorld Administrator jatar_k is a WebmasterWorld Top Contributor of All Time 10+ Year Member



I don't use CSS (too many cross browser issues) but when i need to border specific rows I use, either, a nested table or cells with bgcolor that span the rows I want bordered. You have to be careful with too many nested tables because it can increase rendering time. I use them only if I need one or two rows bordered. Otherwise I use cells with a width, height and bgcolor you just have to put a spacer in the cell for netscape so that it doesn't collapse them if it thinks they are empty.
8:13 pm on Aug 25, 2001 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I'm not 100% sure but I think this isn't even implemented in curent browsers.
12:41 am on Aug 26, 2001 (gmt 0)

10+ Year Member



You will have to specify the class of the start and end cells, but the ones in the middle you can set a default for. You'll need content in each cell for the borders to format correctly in CSS1.

<style>
table.mytab td { border-width: 0 1px 0 0; ... } # default case
table.mytab td.s { border-width: 1px 0 0 0; ... } # start
table.mytab td.e { border-width: 0 0 1px 0; ... } # end
</style>

<table class=mytab>
<tr><td class=s>start</td> <td>middle</td> <td>repeat</td> <td class=e>end</td></tr>
</table>

You'll have to play around with the border widths... i can't remember the order they are specified with using 4 parameters.

Hope that helps.

Alex

11:31 am on Aug 30, 2001 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



The problem with nested tables is that the table contains data and it's damn difficult to maintain the column sizes - end up with a very messy table. Does anybody know a good way around this.

The problem with defining the end cells is the messy javascript it makes - we actually only want the borders to appear on rollover ... but for the whole row. We can see ways to do it but it means writing a ton of javascript and lots of ~duplicate classes for cells everywhere. The tables are generated on the server by XSLT too which just adds complexity as we don't know how many rows there will be - have to check the data etc... Not worth that much hassle methinks.

Thanks for the help and suggestions though.

J

1:50 pm on Aug 31, 2001 (gmt 0)

WebmasterWorld Administrator brett_tabke is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month



Maintaining cell sizes can be a challenge. I usually hack out a nested table solution, or let the sizes just float where they may. If I absolutly need a set width, I'll use a graphic and specify the width and then save row of td's just for the graphic.

Also, don't forget "nowrap" on your td's.