Div tag size for tabbar component

Suite and Optimus Suite 5
#1

Hi,



I am having a page having 3 portions (header, content & footer).

The three portions are denoted by the 3 div tags in the page, each having a portion.



For the content div tag, i have to specify the hardcoded size (as follows):





If i specify the height & width in relative % of screen (like 90%), it doesnot takes the size and creates the div tag of zero height & width.



Due to this zero size, whenever i try to create a dhtmlxWindow OR dhtmlxLayout component, it throws a javascript error.





Could you please provide an example in which i can specify the page with 3 div tags, having hardcoded height of top & bottom (header & footer) components, and the middle component having the dhtmlx components should take the remaining portion automatically.



Thanks,

Vibhav Agrawal
#2


Hello,


you can place the 3E layout into the tab. The top and bottom cells of the layout can have fixed height, another - flexible (depending of tabbar size).


var layout = tabbar.cells(tabId).attachLayout(“3E”);


layout.cells(“a”).setHeight(“100”);
layout.cells(“c”).setHeight(“100”);
layout.cells(“a”).hideHeader(true);
layout.cells(“b”).hideHeader(true);
layout.cells(“c”).hideHeader(true);


dhtmlx.com/docs/products/dht … nside.html




#3

Thanks Alex for the quick response.

I would like to tell u that the top & bottom components are not the dhtmlx component. They are generic javascript/html components which cannot be moved inside dhtmlx component.

Secondly, the tabbar (or any dhtmlx component) exists inside the second tab only.
Sample code:








and this mainTemplateBody div tag contains the dhtmlx component.

If i remove the hardcoded width & height from the above code, it is resulting in a UI with middle div tag (mainTemplateBody) size as 0 (zero). Due to which rendering a layout component in it throws a javascript error.

Could you please let me know any example with such scenario.

Thanks,

Vibhav Agrawal

#4


The example of the tabbar with divs inside (html intialization):





header

body

footer












The sample is dhtmlxTabbar/samples/01_initialization/04_init_from_html.html