sencha-touch - Sencha Touch コンテナ内の HTML オブジェクトを参照する

Question

Sencha Touch 2.0.1 を使用しています。コンテナ内の HTML への参照を取得しようとしています。（私の目的は、オブジェクトの幅を読み取り、必要に応じてフォントサイズを縮小して、うまく収まるようにすることです）。

これが私のコードです：

Ext.define("SFCT.view.Flashcard", { 
    extend: 'Ext.Container', 

    xtype: 'flashcardpanel', 


    requires: [ 
        'Ext.TitleBar' 
    ], 

    config: { 
        itemId: 'mainScreen', 
        title: 'Flashcards', 

        layout: 'fit', 

        items: [ 
            { 
                xtype: 'container', 
                layout: { 
                    type: 'vbox', 
                    pack: 'center' 
                }, 
                items: [ 
                    { 
                        xtype: 'container', 
                        itemId: 'wordContainer' 
                    } 
                ], 
                style: 'text-align: center' 
            }, 
            { 
                xtype: 'button', 
                docked: 'right', 
                text: 'Next', 
                action: 'next' 
            } 
        ] 
    }, 

    updateWord: function(newWord) { 
        var s = '<div style="font-size: 72px">' + newWord+ '</div>'; 
        var c = Ext.ComponentQuery.query('#wordContainer')[0]; 
        console.log(c.getHtml()); 
        c.setHtml(s); 
    } 
}); 

上記のように Ext.Container.getHtml() を使用すると、HTML が文字列として返されます。しかし、その幅を取得できるように、div 要素自体への参照を探しています。

どのように私はそれを行うことができますか？

ありがとう。