homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

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

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

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)

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)

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)

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)

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.

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

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

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.



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

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.



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

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.

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved