How to configure itemTpl for table layout

[Donbydon]

I use list or dataview to display data as a table, for example No, Name, Age. How to configure itemTpl to display 3 columns full screen?
I try itemTpl: '<div style="float: left;">{num}</div><div style="float: left;">{name}</div><div style="float: right;">{age}</div><div style="clear:both;"></div>',
It's work but when the second field is long table layout destroyed.
n1.jpg
If I add to style tag "white-space: nowrap; overflow: hidden;" to second field my table become larger than the screen. Adding width: 10%, width: 40%, width: 20% does not help.
It's work only if I add absolute sizes width: 1em, width: 8em, width: 1em, for the fields, but this is wrong way.
n2.JPG
itemTpl:<table>..</table> not work to..

This is a typical task should be simple solutions, please help..

[rdougan]

This is not something we support out of the box. You would just need to ensure your custom CSS is correct for the itemTpl.

Perhaps checkout [ur=http://www.sencha.com/forum/showthread.php?150431-Ext.ux.touch.grid]Ext.ux.touch.Grid[/url].

[Donbydon]

Thanks for useful link. I include Ext.ux.touch.grid.View in our project, but the problem is still there.
I run example grid.View. It's ok, but if I add item with long name(~70 symols) right column is out of screen. Is it normal behavior?
Columns width are: 40%, 15%, 15%, 15%, 15%. See picture below.
Maybe problem is in ST Dataview's Width calculation..

1.jpg

Is it possible to configure itemTpl to cut the names before displaying them?