View Full Version : ExtJS dynamic vertical panel goes out of borders in smaller screens

24 Sep 2015, 10:02 PM
I have built a web gis application using ExtJS 4 and GeoEext. I have a panel on the right side of the application in which I appear images based on a date filter. For this I have a vertical scroll bar as it can be seen in the first picture.

The problem is that when I am using my application in a smaller screen I can not scroll down till the end of the panel and I can not see all the pictures or other functionality.

I get the impression that ExtJS 4 doesn't really work good with dynamic vertical panels.

How can I fix this issue so my panel and the scroll bar adjusts to the size of the screen as the rest of the application does (e.g. the map view)?

This is the part of the code in which I define the tabs and the panels:

xtype: 'tabpanel',
//width: 426,
//title: 'Tabs',
autoHeight: true,

collapsible: true,
activeTab: 0,
flex: 2,
layout: {type: 'fit'},
items: [{
xtype: 'panel',
title: '???????????',
items: [
{contentEl:'img',autoScroll:true, height:600 }],

xtype: 'panel',
title: '???',
items: [{contentEl:'msg',autoScroll:true,height:600 }]
xtype: 'panel',
title: '??????????',
items: [
{contentEl:'msgStat',autoScroll:true,height:600 }]
xtype: 'panel',
title: '????????',
items: [legend]

5 Oct 2015, 11:38 AM

Issues with scrolling can often be a result of over-nesting of containers + layout configurations. Can you share a working example of the issue that I can test? https://fiddle.sencha.com