PDA

View Full Version : Toolbar button width



tmunz
5 Feb 2008, 11:52 AM
Once again, Firefox v IE. I have an EditorGridPanel being rendered into a template, which sits inside an expander row. This is working fine, the problem is the width of the toolbar button in IE is being sized to the length of the toolbar. As you can see in the screenshots below this is only happening inside the template.

Tempalte:


tpl : new Ext.XTemplate(
'<tpl for=".">' +
'<div class="comments" style="padding: 1em; float: left;"></div>' +
'<div class="status-level" style="clear: both; width: 48%; padding: 1em; float: left;"></div>' +
'<div class="reviewer" style="width: 48%; padding: 1em; float: right;"></div>' +
'</tpl>'
)
});



PANEL that gets EditorGrid


var p1 = new PPRTVCommentGrid(pprtvid);
p1.render(body.childNodes[0]);
p1.selModel.on('rowselect', function(){
p1.getEl().swallowEvent([
'mousedown',
'mouseup',
'rowselect',
'click',
'rowdblclick'
]);
});


EditorGrid


PPRTVCommentGrid.superclass.constructor.call(this,{
title: 'PPRTV Comments',
id: 'pprtv-comment-grid-' + pprtvid,
store: new pprtvcomment_SetupDS(pprtvid),
cm : new pprtvcomment_SetupCM(),
sm : smPPRTVComment = new xg.RowSelectionModel({singleSelect : true}),
autoExpandColumn: 'comments',
shadow: false,
shadowOffset: 0,
autoScroll: true,
buttonAlign: 'left',
clicksToEdit: 1,
lazyInit: true,
//title: 'Status Level',
collapsible:true,
height:250,
autoWidth: true,
//autoHeight: true,
scope: this,
tbar: [{
text:'Add Comment',
tooltip:'Add A New Record',
iconCls:'add',
buttonAlign: 'left',
handler: function(){
addBlankRecord(dsPPRTVComment);
}
}], //END TBAR
viewConfig: {forceFit: true}
}, this);


Any ideas on how to resolve this? I am using 2.0.1

Thanks,
Tim

tmunz
7 Feb 2008, 7:25 AM
Don't know if this is the best solution, but I just created a css hack for the three classes specified in the template.



.comments .x-toolbar table{width:15%}
.status-level .x-toolbar table{width:30%}
.reviewer .x-toolbar table{width:25%}