Report Viewer 10 - CSS Issue

Question

I'm new to reporting services and having trouble getting a report to render correctly on my ASPX page. I'm using MS Report viewer 10 using with asp.net 4.0.

Earlier my toolbar was not rendering correctly in Chrome & Safari

so after some R&D, i found & applied below script for the same

Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(function () { fixReportingServices('divReport'); });

    function fixReportingServices(container) {
        if (navigator.userAgent.indexOf('Safari') != -1 || navigator.userAgent.indexOf('Chrome') != -1) {
            $('#' + container + ' table').each(function (i, item) {
                if ($(item).attr('id') && $(item).attr('id').match(/fixedTable$/) != null)
                    $(item).css('display', 'table');
                else
                    $(item).css('display', 'inline-block');
            });}}

so my toolbar problem got resolved :)

but after applying above so now im facing other CSS issue. now my page number is overlapped by report content. :(

SSRS Report

Any Suggestions Appreciated !!

Answer 1

Holy crap.. resolved by created below script.

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function () { fixToolbar(); });

    function fixToolbar() {
        $("#ctl00_ReportViewer1_Toolbar table").each(function (i, item) {
            $(item).css('display', 'inline-block');
        });
    }