By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,785 Members | 1,079 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,785 IT Pros & Developers. It's quick & easy.

Header columns not aligning with scrolling columns beneath.

P: n/a
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:scroll)?

Thanks for any advice or pointers.

Skip Hollowell.
Jul 20 '05 #1
Share this Question
Share on Google+
7 Replies


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


URL please.
Jul 20 '05 #2

P: n/a
Neal wrote:
I have what is now a table with a header row and then obviously rows
of data beneath.

URL please.


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.
Jul 20 '05 #3

P: n/a
Thomas 'Skip' Hollowell wrote:
Neal wrote:
I have what is now a table with a header row and then obviously rows
of data beneath.


URL please.

Sorry this took a couple days.
http://132.235.1.2/~thollowe/tables.html


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.
Jul 20 '05 #4

P: n/a
Thomas 'Skip' Hollowell wrote:
Neal wrote:
I have what is now a table with a header row and then obviously rows
of data beneath.

URL please.


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

The columns not lining up is driving me crazy.


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.
Jul 20 '05 #5

P: n/a
kchayka wrote:
Your header row (th) and data rows (td) are in 2 different tables. They
should be in the same table.

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.
Jul 20 '05 #6

P: n/a
Thomas 'Skip' Hollowell wrote:
kchayka wrote:
Your header row (th) and data rows (td) are in 2 different tables. They
should be in the same table.

There are two schools of thought on this, separate vs same table.


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.
Jul 20 '05 #7

P: n/a
On Thu, 6 May 2004, Thomas 'Skip' Hollowell wrote:
There are two schools of thought on this,
Presumably the "do it on sound engineering principles" school, and the
"bludgeon it until it looks right, and stuff the structure" school?
separate vs same table.


What I said :-{

Jul 20 '05 #8

This discussion thread is closed

Replies have been disabled for this discussion.