Images in scrollable container won't appear

[Mike6679]

Ok this is driving me nuts, I had scrolling working before but now I have an issue with this implementation of it. I have a number of images that just don't appear in the scrollable container below. I checked the image path and everything else seems to be ok. If I turn off scrollable , then I can see the images, what the heck is goin on?

Ext.define('oracea.view.Pi', {
	extend: 'Ext.Container',
	
        me_pi:'',
        id:'slide_panel_pi',
        left:    '986px',
        hidden:true,
       
        config: {
		
		items: [
                         {
                            xtype:   'image',
                            src:     'resources/images/tabs/tab-PI.png',
                            height:  '250px',
                            width:   '43px',
                            top:     '460px',
                            right:	 '-37px',
                            cls:     'etl_pi',
                            id:      'tab_pi'
                         },
                         {
                             xtype:   'container',
                             style:   'background-color: #bcbbbb;',
                             height:  '768px',
                             left:    '36px',
                             width:   '988px'
                         },
                         {  
                            xtype:'hotspotSlidingPanel',
                            width:70,
                            height:70,
                            top:30,
                            left:1845,
                            id: 'hotspot_pi_close'
                         },
                         {
	                         xtype:'hotspotSlidingPanel',
	                         src:     'resources/images/tabs/panelCloseBox.png',
	                         height:  '60px',
	                         width:   '60px',
	                         top:15,
	                         left:915,
	                         id: 'hotspot_pi_closeX'
                         },
                         
                         {


                                xtype: 'container',
                                top:     50,
                                left:    90,
                                height:   700,
                                width:    900,
				id: 'PI_content_container',


                                layout: 'vbox',  


                                scrollable: true,
                                scroll: 'vertical',
                                
                                items:[
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_01.png',
                                height:  '188px',
                                width:   '840px'


                                },
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_02.png',
                                height:  '230px',
                                width:   '840px'


                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_03.png',
                                height:  '225px',
                                width:   '840px'


                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_04.png',
                                height:  '198px',
                                width:   '840px'


                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_05.png',
                                height:  '232px',
                                width:   '840px'


                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_06.png',
                                height:  '228px',
                                width:   '840px'


                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_07.png',
                                height:  '253px',
                                width:   '840px'


                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_08.png',
                                height:  '236px',
                                width:   '840px'


                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_09.png',
                                height:  '231px',
                                width:   '840px'


                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_10.png',
                                height:  '288px',
                                width:   '840px'


                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_11.png',
                                height:  '247px',
                                width:   '840px'


                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_12.png',
                                height:  '267px',
                                width:   '840px'
                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_13.png',
                                height:  '256px',
                                width:   '840px'
                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_14.png',
                                height:  '260px',
                                width:   '840px'
                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_15.png',
                                height:  '257px',
                                width:   '840px'
                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_16.png',
                                height:  '286px',
                                width:   '840px'
                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_17.png',
                                height:  '248px',
                                width:   '840px'
                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_18.png',
                                height:  '200px',
                                width:   '840px'
                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_19.png',
                                height:  '232px',
                                width:   '840px'
                                }     
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_20.png',
                                height:  '225px',
                                width:   '840px'
                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_21.png',
                                height:  '221px',
                                width:   '840px'
                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_22.png',
                                height:  '242px',
                                width:   '840px'
                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_23.png',
                                height:  '260px',
                                width:   '840px'
                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_24.png',
                                height:  '257px',
                                width:   '840px'
                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_25.png',
                                height:  '255px',
                                width:   '840px'
                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_26.png',
                                height:  '276px',
                                width:   '840px'
                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_27.png',
                                height:  '300px',
                                width:   '840px'
                                }
                                ,
                                {
                                xtype:   'image',
                                src:     'resources/images/tabs/PI_28.png',
                                height:  '243px',
                                width:   '840px'
                                }             


                                ]


                         }
                         
                         
                       ]
	},
         initialize: function(){  
            
            me_pi = this;
         }
         
        
});

[jerome76]

Try adding a container with a layout: 'fit' to wrap your container with the vbox layout. That's all I can give right now. It's hard to test since I don't have the resources.