Magic spaces - how to avoid them?

[elGringo]

Alignig panels on mainform, but viewing magic spaces - how to avoid them (see pics)?

 

used margins 0 -10 0 0 but no effect

 

it must be simple - but have no idea except margins how to fix it ((

 

also - wanted to do sticky top menu - I think to handle on scroll browser event - is it correct how do you think?

to set top:=0 on scroll to pHeader in test case

 

TestCase

https://yadi.sk/d/KrpRtzdo3GgVmZ

 

[elGringo]

set to pHeader LayOutConfig 100% and whitespace from the right disappeared, but other ones still on th place

[mhmda]

This is not 'Magic' spaces it's the border of Window/Panel, you can use css to override this behavior or use 'border' = None from design view. 

[elGringo]

hello, Mohhamed! but i already have BorderStyle=None

[elGringo]

set pFooter align to alNone - and disappeared for pFooter

[mhmda]

Here you go:

 

MainForm->Unievents: 

function window.beforeInit(sender, config)
{
  config.baseCls='frmNoBorderRadius';
  config.cls='frmNoBorderRadius';
}

CSS:

.frmNoBorderRadius {
 border-radius: 0px !important; 
 border: none !important;
}
.x-css-shadow {
 -webkit-box-shadow: none !important;
 -moz-box-shadow: none !important;
 box-shadow: none !important;
}

Result: