View Full Version : [CLOSED] Neptune - grid with docked item (right) creates unwanted vertical scroll

8 Jan 2014, 6:28 AM
When using the Neptune theme and create a layout containing a grid with an docked item to the right - the grid gets an unwanted vertical scollbar. This seem to occur due to Neptunes border free design. If I set border true on the grid, the scrollbar disappear. Is there any other solution to this? Is this a known bug?

I created a fiddle to test this with different themes and only Neptune behaves like this.


Ext.create('Ext.data.Store', {
storeId: 'simpsonsStore',
fields: ['name', 'email', 'phone'],
data: {
'items': [
{'name': 'Lisa', "email": "lisa@simpsons.com", "phone": "555-111-1224"},
{ 'name': 'Bart', "email": "bart@simpsons.com", "phone": "555-222-1234" },
{ 'name': 'Homer', "email": "home@simpsons.com", "phone": "555-222-1244" },
{ 'name': 'Marge', "email": "marge@simpsons.com", "phone": "555-222-1254" }
proxy: {
type: 'memory',
reader: {
type: 'json',
root: 'items'

name: 'Fiddle',
launch: function() {
Ext.create('Ext.grid.Panel', {
title: 'Simpsons',
store: Ext.data.StoreManager.lookup('simpsonsStore'),
columns: [
{text: 'Name', dataIndex: 'name'},
{text: 'Email', dataIndex: 'email', flex: 1},
{text: 'Phone', dataIndex: 'phone' }
dockedItems: [ {
dock: 'right',
xtype: 'panel',
html:'Docked Panel',
width: 400
renderTo: Ext.getBody()

8 Jan 2014, 9:22 AM
I do not see a scollbar ... perhaps a screenshot?

What browser/version?

9 Jan 2014, 12:36 AM
Sorry, I meant a horizontal scrollbar. I use Chrome (Mac) and in this case the scollbar doesn't show until you try to scroll. But in Chrome for PC the scrollbar is visible all the time. I updated the the grid in the fiddle code with a set height so the vertical scroller is present (which also causes the horizontal one to show).

9 Jan 2014, 8:12 AM
Thanks for the report! I have opened a bug in our bug tracker.

For now: (border: true)

.x-panel-default-outer-border-bl {
border-bottom-width: 0 !important;
border-left-width: 0 !important;

.x-panel-default-outer-border-rl {
border-right-width: 0 !important;
border-left-width: 1px !important;

16 Jan 2014, 12:44 AM
Thanks for your help. :)