Report Viewer is to small in some browsers

[Sergio]

Hi Support,

This problem happens in the Server Report Viewer and also in our application from the upgrade to the Telerik Report 2018.

Look de style generate height: 25.5px . !!!

<div class="trv-report-page" style="height: 25.5px; width: 1146px;">

Example:
Image attach

 

Thank You

Sérgio

[Veronika]

Hello Sérgio,

This is a known issue related with some style that came from Telerik Report Viewer. The fix will be available with the next Internal Build.

If you can not wait till then, I can give you a temporary workaround.

Open Preview.cshtml, located in Views/Report folder. In the <style> tag add the following code:

/* ----------- iPad Pro ----------- */
/* Portrait and Landscape */
@@media only screen
  and (min-device-width: 1024px)
  and (max-device-width: 1366px)
  and (-webkit-min-device-pixel-ratio: 1.5) {
    .sheet {
        overflow: unset;
    }
}

Next, in the onDocumentReady function, add the code bellow, immediately after viewer = $("#reportViewer1").data("telerik_ReportViewer");

viewer.bind(telerikReportViewer.Events.PAGE_READY, function (e, arguments) {

    if (window.matchMedia('(min-device-width: 1024px)').matches &&
        window.matchMedia('(max-device-width: 1366px)').matches &&
        window.matchMedia('(-webkit-min-device-pixel-ratio: 1.5)').matches) {

        var sheetDomEl = $("#reportViewer1").find(".sheet"),
            styles = sheetDomEl.attr("style"),
            height = sheetDomEl.get(0).style.height;
        styles = styles.replace(height, height + " !important")

        $("#reportViewer1").find(".sheet").css('cssText', styles);
        $("#reportViewer1").find(".trv-report-page").attr('style', 'height: auto');
    }


    viewer.unbind(telerikReportViewer.Events.PAGE_READY);
});

This should reset the styles that come from the Report Viewer. Let us know if you have other questions.


Regards,
Veronika
Progress Telerik