Header columns not aligning with scrolling columns beneath.

[Skip Hollowell]

I have what is now a table with a header row and then obviously rows of data
beneath. If the data is more than 50 or 6 rows (100px) then the rows will
scroll using overflow:auto. This all works great, but I have alignment
issues with the columns. I can get things to line up in either case (with
scrolling or without scrolling) but not in both. Currently, I am using
Tables to align everything and giving each row a % width. I would love it
if I could find an alternative to tables for this presentation as well.

I have googled my butt off and found a couple solutions that play nicely if
you always have scroll bars, but what if you don't? Do I just bite the
bullet and say always put the bars there (overflow:scrol l)?

Thanks for any advice or pointers.

Skip Hollowell.

[Neal]

Re: Header columns not aligning with scrolling columns beneath.

On Mon, 3 May 2004 12:12:26 -0400, Skip Hollowell
<skip_hollowell 'at'yahoo.com> wrote:
[color=blue]
> I have what is now a table with a header row and then obviously rows of
> data
> beneath.[/color]

URL please.

[Thomas 'Skip' Hollowell]

Re: Header columns not aligning with scrolling columns beneath.

Neal wrote:[color=blue]
>[color=green]
>> I have what is now a table with a header row and then obviously rows
>> of data beneath.[/color]
> URL please.[/color]

Sorry this took a couple days.

http://132.235.1.2/~thollowe/tables.html

There is some extraneous stuff in the sheet, but I tried to pull out as
much as possible. This is only really required for IE 5.5 and up, and I
noticed that that due to my use of overflow-y that it doesn't even
scroll on non-ie browsers.

The columns not lining up is driving me crazy. When using percentages,
I can get close, sometimes. I even have trouble with fixed width
columns though. Any suggestions on these columns, widths, and even
possible CSS-only alternatives would be greatly appreciated.

Thanks
Skip Hollowell.

[Thomas 'Skip' Hollowell]

Re: Header columns not aligning with scrolling columns beneath.

Thomas 'Skip' Hollowell wrote:
[color=blue]
> Neal wrote:
>[color=green]
>>[color=darkred]
>>> I have what is now a table with a header row and then obviously rows
>>> of data beneath.[/color]
>>
>> URL please.[/color]
>
>
> Sorry this took a couple days.
> http://132.235.1.2/~thollowe/tables.html
>[/color]

The only solution I have come up with is to make each table 98% width
(header table and data table), give corresponding columns the same
percentage widths, and live with it. I have also made the overflow-y
to be scoll instead of auto. Once the customer gets used to seeing the
scroll bar all of the time, I don't think it will be that big of a deal.

Alternatives?

Skip.

[kchayka]

Re: Header columns not aligning with scrolling columns beneath.

Thomas 'Skip' Hollowell wrote:
[color=blue]
> Neal wrote:[color=green]
>>[color=darkred]
>>> I have what is now a table with a header row and then obviously rows
>>> of data beneath.[/color]
>> URL please.[/color]
>
> http://132.235.1.2/~thollowe/tables.html
>
> The columns not lining up is driving me crazy.[/color]

Your header row (th) and data rows (td) are in 2 different tables. They
should be in the same table.

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.

[Thomas 'Skip' Hollowell]

Re: Header columns not aligning with scrolling columns beneath.

kchayka wrote:
[color=blue]
> Your header row (th) and data rows (td) are in 2 different tables. They
> should be in the same table.
>[/color]
There are two schools of thought on this, separate vs same table. But
since I am using two separate div tags, one for the header portion and
one for the data portion, I gave each their own table. This keeps the
scroll bar off of the header, and keeps the obscene amount of table code
cleanly differnetiated.

If you have any pros or cons for each style, I would love to hear them.
At this point all I can say is it's all subjective on the best way
to lay this out, that is until I hear differently from someone, and I
hope I do.

Skip.

[kchayka]

Re: Header columns not aligning with scrolling columns beneath.

Thomas 'Skip' Hollowell wrote:
[color=blue]
> kchayka wrote:
>[color=green]
>> Your header row (th) and data rows (td) are in 2 different tables. They
>> should be in the same table.
>>[/color]
> There are two schools of thought on this, separate vs same table.[/color]

The semantically correct way is with the headers in the same table as
the data they apply to. Your markup, as is, is illogical.

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.

[Alan J. Flavell]

Re: Header columns not aligning with scrolling columns beneath.

On Thu, 6 May 2004, Thomas 'Skip' Hollowell wrote:
[color=blue]
> There are two schools of thought on this,[/color]

Presumably the "do it on sound engineering principles" school, and the
"bludgeon it until it looks right, and stuff the structure" school?
[color=blue]
> separate vs same table.[/color]

What I said :-{