PDA

View Full Version : hbox margin problem



sofway
3 Mar 2010, 8:43 PM
Hi,
i have a panel that needs to show two panels inside, one beside the other. So i use hbox layout but i need some space between the 2 horizontal panels. The margin and the anchor properties doesnt work.

Thanks


var panel = new Ext.Panel({
title: "Info",
anchor:'100% 50%',
layout: 'hbox',
style: {
padding: '10px'
},
//width:200,
items: [
{
xtype: 'panel',
title: 'Panel 1',
html: 'panel 1',
anchor: '50% 50%',
style: {
padding: 'margin:10px'
}
},
{
xtype: 'panel',
title: 'Panel 2',
html: 'panel 2',
anchor: '50% 50%'
}
]
});

usiw
21 May 2010, 11:07 AM
Here is a clearer example. This is also visible in Ext Designer. It seems that it ignores the first value in the string version of margins.


{
xtype: 'panel',
layout: {
type: 'hbox',
defaultMargins: 8
},

items: [
{
flex: 1,
xtype: 'fieldset',
margin: 8

},{
flex: 1,
xtype: 'fieldset',
margin: '10 10 10 10'
},{
flex: 1,
xtype: 'fieldset',
margin: {top: 10, left: 10, right: 10, bottom: 10}
}
]
}

LostSoul
21 May 2010, 12:56 PM
try to add this to your second and third fieldset
style:'padding-left:10px;'

or maybe add this below to your panel

bodyStyle: 'padding:5px 5px 0',

usiw
21 May 2010, 1:09 PM
The point of the bug is that it is a bug and needs to be resolved. The margins config options works if you prefix it with a space such as:



margins: ' 10 10 10 10',

//or

margins: ' 10',