[html5] table with fixed headers

Larry Martell larry.martell at gmail.com
Tue Jul 1 09:19:07 PDT 2014


Thanks very much for the reply Martin. But this doesn't seem to fix my
problem - i.e. the column headers are not aligned with the data:

http://jsfiddle.net/34Fd5/

On Tue, Jul 1, 2014 at 9:27 AM, Martin Gainty <mgainty at hotmail.com> wrote:
> white-space: nowrap
>
> <html>
> <head>
> <title>this song has no title</title>
> </head>
> <style>
> td:nth-child(1)  { white-space: nowrap }
> td:nth-child(2) { white-space: nowrap }
> td:nth-child(3) { white-space: nowrap }
> </style>
> <body>
> <table id="table" border cellspacing=0 style="width: 100%">
> <tr>
> <td style="">NAME</td>
> <td style="">This is a short message</td>
> <td>TIME</td>
> </tr>
> <tr>
> <td>NAME OTHER</td>
> <td>This is a
> llllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllloooooooooooooooonnnnnnnnnnnnnngggggggggggggggggggg
> message</td>
> <td>TIME_VERY_LONG_FORMAT</td>
> </tr>
> </table>
> </body>
> </html>
>
> *Saludos Cordiales desde EEUU*
> Martín
> _________________
>
>
>> Date: Tue, 1 Jul 2014 07:00:48 -0400
>> From: larry.martell at gmail.com
>> To: help at lists.whatwg.org
>> Subject: [html5] table with fixed headers
>
>>
>> I am trying to implement a table with fixed headers using the concepts
>> from this page:
>>
>> http://www.imaputz.com/cssStuff/bigFourVersion.html#
>>
>> When I implemented the CSS from that page, my table columns are not
>> aligned with the table headers.
>>
>> http://jsfiddle.net/softvar/yL84C/
>>
>> I was able to 'fix' this by explicitly setting the cell size:
>>
>> http://jsfiddle.net/cFr38/
>>
>> But that doesn't really work well for my app as I have 10 different
>> tables the user can display, and they each have 25-35 columns, and I
>> do not necessarily know in advance how wide the data will be.
>> Currently, without the fixed headers, I do not specify the column
>> width and they are automatically sized. Is there any way to get fixed
>> headers without explicitly setting the width of the table cells?
>> _______________________________________________
>> Help mailing list
>> Help at lists.whatwg.org
>> http://lists.whatwg.org/listinfo.cgi/help-whatwg.org


More information about the Help mailing list