TR's w no Style?

[mike]

I ran across a situation where I could not format my row bottom border
color.

I was using:

<tr style="border-bottom:solid 1px #cccccc;">

and it didn't work, but

<td style="border-bottom:solid 1px #cccccc;">

did.

Why is that?

Mike

[Lachlan Hunt]

mike wrote:
> I ran across a situation where I could not format my row bottom border
> color.

It generally helps if you:
1. Provide a URI to a page that demonstrates the issue
2. Mention which browser is experiencing the problem

> I was using:
>
> <tr style="border-bottom:solid 1px #cccccc;">
>
> and it didn't work, but
>
> <td style="border-bottom:solid 1px #cccccc;">

Such incomplete test cases are useless. However, since I have seen this
problem before, it is a bug with Firefox 1.0.x that has been fixed in
more recent builds. Do any of these test cases demonstrate the issue?

http://lachy.id.au/dev/css/tests/css21/20050705/t170206-bdr-cnflct-dsp-23-d.xht
http://lachy.id.au/dev/css/tests/css21/20050705/t170206-bdr-cnflct-dsp-26-d.xht
http://lachy.id.au/dev/css/tests/css21/20050705/t170206-bdr-cnflct-dsp-27-d.xht
http://lachy.id.au/dev/css/tests/css21/20050705/t170206-bdr-cnflct-dsp-37-d.xht
http://lachy.id.au/dev/css/tests/css21/20050705/t170206-bdr-cnflct-dsp-40-d.xht
http://lachy.id.au/dev/css/tests/css21/20050705/t170206-bdr-cnflct-dsp-42-d.xht

--
Lachlan Hunt
http://lachy.id.au/
http://GetFirefox.com/ Rediscover the Web
http://GetThunderbird.com/ Reclaim your Inbox

[mike]

Sorry, its IE and the test case is simply:

<table>

<tr style="border-bottom:solid 1px #cccccc;">

<tr>stuff1</tr><tr>stuff2</tr><tr>stuff3</tr><tr>stuff4</tr>
</tr>

<tr style="border-bottom:solid 1px #cccccc;">

<tr>stuff1</tr><tr>stuff2</tr><tr>stuff3</tr><tr>stuff4</tr>
</tr>
<table>

should be a bottom border.

[Mark Parnell]

In our last episode, mike <hil...@charter.net> pronounced to
comp.infosystems.www.authoring.html:

<snip code>

> should be a bottom border.

No, it shouldn't be anything. Try running your page through the
validator. You can't nest table rows.

--
Mark Parnell
http://clarkecomputers.com.au

[Lauri Raittila]

Missing border-collapse:collapse; on table?

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>

[mike]

Sorry about that .... typos there. Those were <td> tags ..

<table>
<tr style="border-bottom:solid 1px #cccccc;">

<td>stuff1</td><td>stuff2</td><td>stuff3</td><td>stuff4</td>

</tr>
<tr style="border-bottom:solid 1px #cccccc;">

<td>stuff1</td><td>stuff2</td><td>stuff3</td><td>stuff4</td>
</tr>
<table>

[mike]

What I really want is the rows to be underlined.

<table cellspacing="0">
<tr>
<td style="border-bottom:solid 1px #cccccc;">stuff1</td>
<td style="border-bottom:solid 1px #cccccc;">stuff2</td>
<td style="border-bottom:solid 1px #cccccc;">stuff3</td>
<td style="border-bottom:solid 1px #cccccc;">stuff4</td>
</tr>
<tr>
<td style="border-bottom:solid 1px #cccccc;">stuff1</td>
<td style="border-bottom:solid 1px #cccccc;">stuff2</td>
<td style="border-bottom:solid 1px #cccccc;">stuff3</td>
<td style="border-bottom:solid 1px #cccccc;">stuff4</td>
</tr>
<table>

This is the workaround. I would think I could format the <tr> row tags
to achieve this.

Comments?

Mike

[Els]

mike wrote:

Yes.
Take the cellspacing off the table and the styles off the td elements,
give the table a class (unless you want that border on all tables),
and set the style in the stylesheet/styleblock:

table.someclass{
border-collapse:collapse;
}
table.someclass td{
border-bottom:solid 1px #cccccc;
}

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

[mike]

So, you are saying that the mark-up is on the TD tag and is NOT
AVAILABLE on the TR tag, correct?

[Lachlan Hunt]

mike wrote:
> So, you are saying

Well, I'm not sure what was said, since you didn't quote what you are
replying too! Please learn to quote properly.

> that the mark-up is on the TD tag and is NOT AVAILABLE on the TR tag, correct?

No, you can style tr elements in the same way you can style td elements.
Just change the selector to select tr instead of td, like this:

table.someclass{
border-collapse:collapse;
}
table.someclass tr{
border-bottom:solid 1px #cccccc;
}

--

[Mark Parnell]

In our last episode, mike <hil...@charter.net> pronounced to
comp.infosystems.www.authoring.html:

> Sorry about that .... typos there.

That's one of many reasons a URL is much more useful than snippets of
code.

[mike]

table.someclass tr{
border-bottom:solid 1px #cccccc;
}

This is not going to work. It the same thing as if I manually put:

<tr style= "border-bottom:solid 1px #cccccc;">

Which i did in the first post. In that post I asked why this does not
work. I am using IE.

[Els]

mike wrote:

It doesn't work on TR in IE.
Specs dictate it should, but IE isn't following the specs in this.
Setting it on the TD instead is the workaround for it.

[Keith Baird]

"mike" <hil...@charter.net> wrote:

The very first response you got was the correct one: you haven't
specified the table's border model. Since you want inline style, here's
how:

<table cellspacing=0 style="border-collapse:collapse;">

<tr>
<td style="border-bottom:solid 1px #cccccc;">stuff1</td>
<td style="border-bottom:solid 1px #cccccc;">stuff2</td>
<td style="border-bottom:solid 1px #cccccc;">stuff3</td>
<td style="border-bottom:solid 1px #cccccc;">stuff4</td>
</tr>
<tr>

<td style="border-bottom:solid 1px #cccccc;">stuff1</td>
<td style="border-bottom:solid 1px #cccccc;">stuff2</td>
<td style="border-bottom:solid 1px #cccccc;">stuff3</td>
<td style="border-bottom:solid 1px #cccccc;">stuff4</td>
</tr>
<table>

[Els]

Keith Baird wrote:

That's what Mike meant from the beginning: it's a work-around for
having a bottom underlining on the TR.

[mike]

That's right Els .... I was saying that the border-bottom did not work
in TR's.