View Full Version : Looking for a little help/advice on tables and css

02-13-2011, 05:45 PM
Simply out, I'm wondering if its possible to control the top border of a td in a table. I'm working on a project where a list of users are displayed in a table, and when a user is flagged, I want to put a yellow border around it. So far, no luck, as I can't get the top border of any row except for the first row, to show in the right color. I've made the top and bottom borders of all tds black, so it spaces evenly, but I can't get the top border to do so... it seems that the bottom border of the row above overlays. Is there something I'm missing, via border-collapse or something similar? Or is this not a viable system with tables (I could easily rewrite this as a series of divs, but semantically, it is a able of information, so I'm trying to keep it is as such).

02-13-2011, 06:04 PM
Can you not give the tds an id or class name and target them that way ?

Have you tried giving them a little more padding/margin to try and space them to see what is going on?

02-13-2011, 08:09 PM
How I have it set up is the tr of row in question gets a class "flagged", and the css points to .flagged td. I have tried adding paddings and margins, but as far as I can tell, td's aren't affected by margins? Which makes sense on a table I guess.

02-13-2011, 08:15 PM
Ok, two more ideas.

Have you tried making the border absolutely excessive in an attempt to make it easier to see whether it is doubling up or overlapping ?

How about you put a <p> or <h5> tag inside each td, and target the borders on that ?

02-13-2011, 09:21 PM
Meh... if I'm gonna start using other techniques to actually get my border, I'd much rather just rebuild it into a set of divs.

02-13-2011, 09:31 PM
Ok, final thing though, Do you have rules="all" set in the table declaration ?

The border behaviour of the td's seems to be much more what you want without that set.

02-13-2011, 09:38 PM
Right, the borders seem to overlap so you don’t see the change on that one border. Table cells aren’t quite meant to do this so the best would be to really have a div in that cell and set the border color with it. Alternatively you could just change the background color of the cell.

02-14-2011, 04:55 AM
Yah, the issue is background colors are meant to mark something else (3 different things actually), so I hoped I could go with borders... I guess its back to testing css, or going to divs... I hate breaking proper semantics :p