button rendering problem with own template

[bernd01]

Hi all,

I have a problem when using an own template with a button.
Here is my template:

            button_template = new Ext.Template(
                '<table cellspacing="0" border="0" height="50"><tbody>',
                '<tr>' +
                '<td>' +
                '<table cellspacing="0" class="x-btn {3}" width="100%" height="100%"><tbody class="{4}">',
                '<tr><td class="x-btn-tl"><i> </i></td><td class="x-btn-tc" width="70"></td><td class="x-btn-tc"></td><td class="x-btn-tr"><i> </i></td></tr>',
                '<tr><td class="x-btn-ml"><i> </i></td><td class="x-btn-mc" width="70" height="70"><img src="data:image/png;base64,'+ this.profile_picture +'"></td><td class="x-btn-mc" style="text-align:left"><em class="{5}" unselectable="on" text-align="left"><button id="button_text_id_'+ this.id +'" class="x-btn-text {2}" type="{1}"><table border="1"><tr><td>&nbsp;&nbsp;&nbsp;'+ this.firstname +' '+ this.lastname +'</td></tr><tr><td>&nbsp;&nbsp;&nbsp;'+ this.firstname +' '+ this.lastname +'</td></tr></table></button></em></td><td class="x-btn-mr"><i> </i></td></tr>',
                '<tr><td class="x-btn-bl"><i> </i></td><td class="x-btn-bc" width="70"></td><td class="x-btn-bc"></td><td class="x-btn-br"><i> </i></td></tr>',
                    "</tbody></table>" +
                '</td>' +
                '<td width="50" align="center">bla</td>' +
                '</tr>',
                '</tbody></table>'); 

enclosed you can also find a picture with the button in it. The text in the middle should not be cuttet of horizontally.

Does anybody know what is wrong here?

Thanks a lot,
Bernd