Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #20182

Re: Alignment of three tables

Show all headers | View raw

On Sun, 09 Jun 2013 08:49:24 -0600, Mel Smith wrote:

>     What is the best technique please ?

The problem seems to be that your table and column widths may not match 
across the three tables. The following untested javascript attempts to 
set 3 tables each with 7 columns so that all columns in each table have 
the same width.

Note that it even if it works on plain tables, it will break if any of 
the tables has, for example, a cell containing a rowspan or colspan 
attribute with a value other than 1.

Consider a table with two similar sets of 3 columns either side of a 
spacer column, the 3 main column widths are 95, 150 and 150 px, the 
spacer column is 10 px, and the table width is 800 px:

cwidths = new Array( 95, 150, 150, 10, 95, 150, 150 );

tables = document.getElementsByTagName( "table" );
for ( i = 0; i < tables.length; i++ )
for ( j = 0; j < tables[i].rows.length; j++ )
for ( k = 0; k < tables[i].rows[j].length; k++ )
tables[i].rows[j].cells[k].style.width = cwidths[k];

This may not be the best technique. Pointy will probably decry it as 
being utter crap, without actually offering any viable alternative, 
because that's what pointy usually does.

Technically it's possible that you should refer to the elements in each 
collection of nodes using "collection.item(index)" instead of "collection
[index]", so that then the three references:

tables[i].rows.length
tables[i].rows[j].length
tables[i].rows[j].cells[k].style.width

would become something like:

tables.item(i).rows.length
tables.item(i).rows.item(j).length
tables.item(i).rows.item(j).cells.item(k).style.width

etc etc, but in practice, I believe that both methods work equally well.

It may be faster to simply process row 0 of each table, as long as 
nothing will have attempted to set the widths of any other cells:

cwidths = new Array( 95, 150, 150, 10, 95, 150, 150 );

tables = document.getElementsByTagName( "table" );
for ( i = 0; i < tables.length; i++ )
for ( k = 0; k < tables[i].rows[0].length; k++ )
tables[i].rows[0].cells[k].style.width = cwidths[k];

-- 
Denis McMahon, denismfmcmahon@gmail.com

Back to comp.lang.javascript | Previous | Next — Previous in thread | Next in thread | Find similar | Unroll thread

Thread

Alignment of three tables "Mel Smith" <med_cutout_syntel@aol.com> - 2013-06-09 08:49 -0600
  Re: Alignment of three tables Scott Sauyet <scott.sauyet@gmail.com> - 2013-06-09 08:18 -0700
  Re: Alignment of three tables Denis McMahon <denismfmcmahon@gmail.com> - 2013-06-09 20:02 +0000
    Re: Alignment of three tables "Mel Smith" <med_cutout_syntel@aol.com> - 2013-06-09 15:01 -0600
      Re: Alignment of three tables Denis McMahon <denismfmcmahon@gmail.com> - 2013-06-09 22:50 +0000
    Re: Alignment of three tables Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-06-10 00:46 +0200
      Re: Alignment of three tables John Harris <niam@jghnorth.org.uk.invalid> - 2013-06-10 14:41 +0100
        Re: Alignment of three tables Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-06-10 17:35 +0200
      Re: Alignment of three tables "Mel Smith" <med_cutout_syntel@aol.com> - 2013-06-10 09:08 -0600
        Re: Alignment of three tables "Mel Smith" <med_cutout_syntel@aol.com> - 2013-06-10 11:16 -0600
          Re: Alignment of three tables Denis McMahon <denismfmcmahon@gmail.com> - 2013-06-11 02:05 +0000
            Re: Alignment of three tables Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-06-11 05:09 +0200
              Re: Alignment of three tables "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2013-06-11 10:59 +0200
                Re: Alignment of three tables Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-06-11 16:51 +0200
              Re: Alignment of three tables Stefan Weiss <krewecherl@gmail.com> - 2013-06-14 15:38 +0200
                Re: Alignment of three tables Eric Bednarz <bednarz@fahr-zur-hoelle.org> - 2013-06-14 20:26 +0200
                Re: Alignment of three tables Stefan Weiss <krewecherl@gmail.com> - 2013-06-14 21:22 +0200
                Re: Alignment of three tables Eric Bednarz <bednarz@fahr-zur-hoelle.org> - 2013-06-15 00:36 +0200
                Re: Alignment of three tables Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-06-15 12:04 +0200
                Re: Alignment of three tables Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-06-15 11:41 +0200
                Re: Alignment of three tables Stefan Weiss <krewecherl@gmail.com> - 2013-06-15 13:53 +0200
                Re: Alignment of three tables Scott Sauyet <scott.sauyet@gmail.com> - 2013-06-17 04:28 -0700
  Re: Alignment of three tables "Andy" <andy@NOSPAMmanyplay.com> - 2013-06-10 09:19 +0100
  Re: Alignment of three tables Dr J R Stockton <reply1300@merlyn.demon.co.uk.invalid> - 2013-06-12 18:56 +0100

csiph-web