scheduler in container with 100% height and width

I want to use the scheduler in container as such…

....

dhx.ui({
container:“schedulerDiv”,
view: “scheduler”,
id: “scheduler”
});

hear i want width and height should be 100%
…like

but in this case the scheduler is not displaying
pls help me to fix it

Hello,

If “container” property is not set, scheduler will be displayed in full-screen mode. However, if 100% size container is required, you need to check that document body has 100% height:

html,body{ height: 100%; }

Thanks for your reply Alexandra

Now i used
html, body
{
height: 100%;
}
and the container to be

Hear the scheduler viewed in full screen but it’s not responsive and the footer disappeared

so, what should i do to make responsive inside the container and footer to appear

Note: I tested html,body{width: 100%} but its not working

Thankyou

If you use our full screen initialization, the library automatically adjusts scheduler sizes to screen size. But if you create scheduler in a certain container, you should apply some logic to make scheduler responsive.
You can call adjust() method that changes view sizes to fit parent container. This method can be called from onRotate event and window resize event listener:

var t=null; dhx.event(window,"resize",function(){ if(t) window.clearTimeout(t); t = window.setTimeout(function(){ $$("scheduler").adjust(); },100) }); dhx.attachEvent("onRotate",function(){ $$("scheduler").adjust(); });

Dear Alexandra,

I create scheduler in a container and the resize working

but, i used header bar in a div under the div i placed container like…

.headerbar{ height:52px; width:100%; . . . }

In this case the footer disappears

if i removed header means it works so, how can i fix this

Thanks…

Pls, Reply…

Hello,

header element has some height. Therefore, the part of a div with 100% height is out of the screen. You can set fixed height for div in instead of height percent (calculate it if it is needed) or rows layout of dhtmlxTouch.