row border color

Question

I want to set the border of <tr> to yellow. I can set the border of <td> but can't figure how to set border of row <tr>. How to do this?

Thanks.

Duplicate of http://stackoverflow.com/questions/3589614/is-it-possible-to-have-a-border-around-a-table-row-in-some-way — Pekka, Mar 13 '11 at 09:54

score 12 · Answer 1 · answered Mar 13 '11 at 10:22

12

This example is working fine on IE8, Chrome 9 and Firefox 3.6 so I really can't see what is the problem.

HTML used in the example:

<table>
    <tr>
        <td>AAA</td>
        <td class="middle">BBB</td>
        <td>CCC</td>
    </tr>
</table>

CSS:

.middle { border: 2px solid blue; }
tr { border: 2px solid red; }

Result:
enter image description here

answered Mar 13 '11 at 10:22

Shadow The GPT Wizard

66,030
26
140
208

Outstanding! Thanks, shadow wizard. – Pete Wilson Mar 13 '11 at 11:04

Pete Wilson · Accepted Answer · 2011-03-13T10:17:24.667

6

No can do, ime, even though css spec ( http://www.w3.org/TR/CSS2/box.html#border-properties ) plainly says border and border-color can be applied to "all elements". Though it might be because <table> might not fall under the box model; I'm not sure about this.

In any case, it's a counter-intuitive, crazy-seeming, page-bloat-inducing pita.

There must be better solutions than bordering every single table cell, which is what I end up doing.

-- pete

edited Mar 13 '11 at 10:17

answered Mar 13 '11 at 09:57

Pete Wilson

8,610
6
39
51

2

I think you're wrong. TR elements does accept border. – Matthieu Feb 19 '14 at 16:18

score 6 · Answer 3 · answered Dec 09 '11 at 16:21

6

It does work, and by the spec.
The problem is that the borders collapse, and you did not expect that.

And by the spec the border for td tends to dominate over the border for tr:
http://www.w3.org/TR/CSS2/tables.html#border-conflict-resolution

answered Dec 09 '11 at 16:21

ANeves

6,219
3
39
63

score -1 · Answer 4 · answered Feb 18 '16 at 13:40

-1

I did it without css.

<TR BORDERCOLOR="RED" BGCOLOR ="PINK">output

works in IE but not firefox,chrome or even edge.

answered Feb 18 '16 at 13:40

kbx

21

score -1 · Answer 5 · answered Mar 13 '11 at 09:53

Write a CSS rule for the tr element? Something like tr {border: ...} Have you tried this and it's not working? Validate your HTML code first with the W3C markup validator and solve the errors if there are any indicated.

row border color

5 Answers5

Linked