How to nest a map inside a div tag?

[rockinthesixstring]

I can only seem to find tutorials on how to get a map to fill a panel.

My home screen is setup to have a map nested inside a div tag, I'm wondering how I might be able to accomplish this?

this is just a raw concept of what I'm looking for.

<tpl for".">
    <div id="home-banner">{html}</div>
    <div id="map-container">***MY MAP GOES HERE***</div>
    <div class="right">contact us</div><div class="left">about us</div>
</tpl>

[bharatn]

Does this help?

Ext.setup({
    onReady: function(){
        var mainPanel = new Ext.Panel({
            fullscreen: true,
            id: 'mainPanel',
            items: [new Ext.Panel({
                html: '<div id="home-banner">test</div>'
            }), new Ext.Map({
                id: 'map-container',
                useCurrentLocation: true,
                width: 500,
                height: 500
            
            }), new Ext.Panel({
                html: '<div class="left">about us</div>'
            })]
        });
        
        
        
    }
});