Path: csiph.com!v102.xanadu-bbs.net!xanadu-bbs.net!feeder.erje.net!us.feeder.erje.net!news2.arglkargh.de!newsfeed.fsmpi.rwth-aachen.de!news-1.dfn.de!news.dfn.de!fu-berlin.de!uni-berlin.de!individual.net!not-for-mail
From: "Mel Smith" <med_cutout_syntel@aol.com>
Newsgroups: comp.lang.javascript
Subject: Re: Alignment of three tables
Date: Mon, 10 Jun 2013 09:08:50 -0600
Lines: 73
Message-ID: <b1m8g6Fjnc5U1@mid.individual.net>
References: <b1jivmF20mgU1@mid.individual.net> <kp2n16$ror$1@dont-email.me> <9415734.fqrm2ecmqt@PointedEars.de>
X-Trace: individual.net 67Ob3wdB1lAdIBdTiASx4gSebK5+ckHZjYAMUVOPPn4PV85wKV
Cancel-Lock: sha1:bApaCeq7VIDD3NgMfPKuxKJYH7k=
X-Priority: 3
X-MSMail-Priority: Normal
X-Newsreader: Microsoft Outlook Express 6.00.2900.5931
X-MimeOLE: Produced By Microsoft MimeOLE V6.00.2900.6157
X-RFC2646: Format=Flowed; Original
Xref: csiph.com comp.lang.javascript:20191

Denis and Thomas said:
> snip <


> Or in ECMAScript/DOM, if the third-best technique must be used:
>
>  var widths = [95, 150, 150, 10, 95, 150, 150];
>  var tables = document.getElementsByTagName("table");
>  for (var i   = 0,
>           len = tables && tables.length;
>       i < len;
>       ++i)
>  {
>    for (var j     = 0,
>             cells = tables[i].rows[0].cells,
>             len2  = cells.length;
>         j < len2;
>         ++j)
>    {
>      cells[j].style.width = cwidths[k] + "px";
>    }
>  }
>
> A table column is in general always as wide as the widest cell of the
> column.  Defining the CSS-width of the cells of other rows than the first
> row (of a table body), too, has *no* (positive) effect.
>

Hi Thomas & Denis:

    Thank you both for your suggestions.

    (To my clients, the three tables look like *one* table with an 
always-visible top row, and an always visible bottom row, and up to 1500 
data rows between them)

    I will re-build my three tables acccoding to the 'third-best' technique 
(because I understand it better), and strip out all the 'width' stuff from 
the <table> definitions and place it in my JavaScript.

    However, I am now trying to remove as much of the 'px' stuff as I can, 
and replace most sizing with 'em' and '%' definitions.

    My three 'tables' are :

        -    A top table of one <thead> section with one <tr> row *only* (of 
five <th> columns). This 'table' serves as an *always-visible* caption-like 
row for the middle table.  I do not use the <caption> tag because it 
disapears on scrolling the middle table

        -    A middle table of data of data with up to nearly 1500 rows (of 
five columns) containing all the data, and finishing with a <tfoot> section 
of one <tr> row with five <th> columns .  This table always has a scroll-bar 
on the right-side to traverse the (up to) 1500 rows

        -    A bottom table of one <thead> section with one <tr> row, and 
five <th> columns. Two of the <th> columns serve as searh <input> text 
fields.  This table serves as the always-visible means of quickly searching 
for values in the main table above it.

    So, I'll try to remove all my width stuff from the tables, and place 
them in an onload  JS function. Because I'm building for the DocType  HTML5 
now, I want to replace a lot of my 'px' sizing with 'em' or '%' -- as I 
mentioned above.

 Thanks again.

-Mel


    I