DhtmlxLayout 2.5 supports margins that can be usefull in fullscreened init. For example, to add logo in the header or company info in the footer.
On default, fullscreened layout have the following margins (2px from each side):
dhxLayout.cont.obj._offsetTop = 2; // top margin dhxLayout.cont.obj._offsetLeft = 2; // left margin dhxLayout.cont.obj._offsetHeight = -4; // bottom margin dhxLayout.cont.obj._offsetWidth = -4; // right margin
To create fullscreened layout with your custom margins - make the following steps:
1. Firstly, apply style for the correct layout positioning
html, body { width: 100%; height: 100%; margin: 0px; padding: 0px; overflow: hidden; }
2. Then, init an dhtmlxLayoutObject object.
var dhxLayout = new dhtmlXLayoutObject(document.body, "3L");
3. Set margins (for example, top and bottom margins)
dhxLayout.cont.obj._offsetTop = 10; // top margin dhxLayout.cont.obj._offsetHeight = -30; // bottom margin // dhxLayout.cont.obj._offsetLeft = 10; // left margin // dhxLayout.cont.obj._offsetWidth = -20; // right margin
4. And to apply new margins - adjust layout's position/dimension
dhxLayout.setSizes();
Complete HTML Page you can find here: