Report Viewer 9 Compresses Reports In Newer Browsers

Question

Deep in the HTML generated by the report viewer when viewing a report on a web page, are a couple of frames then a table that holds the report.  In the table are two cells.  The first is called oReportCell and the second doesn't have any name. 
The report is displayed inside oReportCell.  However, the second cell has a width=100% attribute assigned to it.  I believe in earlier browsers the report was allowed to stretch out as wide as it needed in oReportCell then the second cell took up
the rest of the room.  In modern browsers it appears that the second cell is taking up as much room as it can by compressing the report.  I've been able to use built in browser tools to set the width of the second cell to 0 and when I do that
the report resized perfectly.  The width=100% attribute of the second cell is messing up the reports.  Check it out in Chrome or any other browser and you'll see the report is compressed.  Change the attribute of the second cell using developer
tools and the report will resize correctly.  I've tried using CSS and jQuery in the web form that hosts the control but because of the frames I can't gain access.  Is there any fix for this?  My company has dozens of reports and at this moment
we're looking at having to completely rewrite all of them using Crystal just because of this one cell's attribute.  Any help would be immensely appreciate and save my company thousands and thousands of dollars!

Answer 1

I finally fixed the problem with the following code:
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
var iFrame = $("#ReportFrameReportViewer");
iFrame.load(function () {
var rptFrame = iFrame.contents().find('#report');
var $td;
if (rptFrame.contentWindow) {
$td = $(rptFrame[0].contentWindow.document).find("#oReportCell");
} else {
$td = $(rptFrame[0].contentDocument).find("#oReportCell");
$td.next().attr("width", "0");
$td.next().css("width", "0");
var rptFrame2 = iFrame.contents().find('#report');
if (rptFrame2.length > 0) {
var $td2;
if (rptFrame2.contentWindow) {
$td2 = $(rptFrame2[0].contentWindow.document).find("#oReportCell");
} else {
$td2 = $(rptFrame2[0].contentDocument).find("#oReportCell");
$td2.next().attr("width", "0");
$td2.next().css("width", "0");
</script>
This works and fixes the problem in most modern browsers however there is still an issue with Chrome because the dynamic tables in the report do not resize after the main container resizes. Time constraints preclude me from additional research at this time.
Darrell Sparti