ASP.net MVC 3 hosting the scheduler inside a complex page

Scheduler Javascript
#1

I am trying to host the scheduler inside a page that has other controls and other styles (a header with css-based navigation, a footer with simple text, and margins on either side of the page).

It appears that unless the top-level

for the scheduler is at the root level of the page, nothing will display. It also appears that other styles cause the scheduler to be incorrectly formatted. I can’t seem to get the navigation header to format correctly and the days of the week headers are skewed from the actual days themselves.

The scheduler seems to be very capable, but I can’t seem to get it to display properly with other controls on the page. I have run up the sample you provide and it works fine, but it has no real content besides the schedule.

Are there guidelines for the specific configuration of style on elements used by the control? It seems that something about other style elements is causing formatting problems with the scheduler, but it’s not anything obvious. Are margins not allowed? I am also finding that the footer shows up in the middle of the calendar, as if the size of the calendar is not being factored into the layout with the default div sizes (width and height of 100% for the div ‘dhx_cal_container’).

Any guidance would be appreciated.

#2

a) scheduler’s div can be placed anywhere on the page, but you need to provide correct sizes for it, default height:100% may work well on top level, but inside some other container it may be equal to 0px. So provide fixed width and height in pixels, or if you are using percents - be sure that parent containers has some width, height

b) as for style - if you have global css which changes styling of all tags on the page, it may cause the problem. You can add conter-css rules like next

.dhx_cal_container td{ /*will reset global TD rules*/ padding:0px; margin:0px; }

#3

Thanks, you gave me enough to get past my problems. I really appreciate your quick reply.