Fixing Report Viewer control toolbar in Google Chrome

Description:-

In this example we explain that how to display Report Viewer toolbar in a single row in Google Chrome browser and Firefox browser. By default it displays toolbar in a multiple rows in Chrome browser.

So here we explain SQL Server Reporting Services Report Viewer control has a toolbar that is not displayed correctly in Google Chrome browser and Firefox because On Google Chrome, each button in the toolbar takes a separate line so how to set toolbar of Report Viewer from multiple rows to single row in Chrome and Firefox browser.

So here we convert code into Browser capability code so in every browser the report viewer toolbar are display in single row with same layout.

I was faced that type of problem and finally I got the solution

As we know that In Chrome browser, Report Viewer (8 & 9) toolbar elements are displayed in multiple rows as shown below.

After implementing below code the report viewer toolbar will be display in single line like

Code:-

<script type="text/javascript">
$(document).ready(function () { 
if ($.browser.webkit) { 
$(".ms-report-viewer-control :nth-child(3) table").each(function (i, item) { 
$(item).css('display', 'inline-block'); 
}); 
} 
}); 
</script>

Author : Umesh Patel

Related Posts