[html5] table with fixed headers

Martin Gainty mgainty at hotmail.com
Tue Jul 1 06:27:58 PDT 2014


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
 		 	   		  
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.whatwg.org/pipermail/help-whatwg.org/attachments/20140701/626ecba5/attachment.htm>


More information about the Help mailing list