PDA

View Full Version : Grid cell vertical alignment



martinrame
11 Aug 2012, 2:53 PM
Hi, I would like to know how can I vertical-align text in a Ext.Grid cell. By default, text is top aligned, and I want to align to middle.

Regards,
Leonardo.

mankz
12 Aug 2012, 6:56 AM
Try setting valign=middle on the tdAttr variable in the column renderer or use line-height.

jumpow
6 Aug 2013, 11:12 PM
There is code... And where I have to put valign=middle?
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />
<link rel='stylesheet' type='text/css' href='extjs/resources/css/ext-all.css'>
<script type='text/javascript' src='extjs/ext-all-debug.js'></script>

<script type="text/javascript">
Ext.onReady(function(){
var myData = [
['Example<BR>23<BR>- - - -<BR>Try<BR>to<BR>Align<BR>top<BR>','How?']
];
var store = new Ext.data.ArrayStore({
fields: [ {name: 'Desc'}, {name: 'Top'} ],
data: myData
});
var grid = new Ext.grid.GridPanel({
store: store,
tdAttrs:
{
style:
{
valign:top
}
},
columns:
[ {header: 'Multiline', width: 160, dataIndex: 'Desc'},
{header: 'Must be Top', width: 75, dataIndex: 'Top'}
],
stripeRows: true,
autoExpandColumn: 'company',
width: 237,
title: 'Array Grid',
renderTo: document.body
});
});
</script>
<body></body>
</html>