SSRS: 2005, CSS not applied on first column - sql-server

Question

Some of our reports aren't displaying properly in Firefox - the first column lacks any css. After investigating, I'm finding:
<tr>
<td style="HEIGHT:6.93mm" style="...">1st Column</td>
<td style="...">2nd Column</td>
<td style="...">3rd Column</td>
</tr>
When I remove the style="HEIGHT:6.93mm", it renders properly in Firefox.
Per JudyX's post here on Monday, February 13, 2006 11:54 PM:
The first column in reports cannot be styled correctly. The report viewer control requires a “height” be specified for all table rows. Unfortunately, it applies this not to the table-row element, but to the first table-cell within that row. When it applies that as a style attribute, it conflicts with the style that we set elsewhere.
Has anyone found a solution to this?

Answer 1

I can confirm that this still happens with SSRS 2005. Firefox is not the only browser that will not render this as intended by the report designer. Apparently IE7 (and probably IE6) assume the last style attribute to "win" if there are multiple style attributes assigned on an element. IE8 in standards mode and Firefox assume the first style attribute to "win" in this situation. I would assume that all standards compliant browsers will make the same choice as IE8 and Firefox, although our team has not tested this.
I haven't found a solution in terms of a hotfix, but I do have a way to prevent the bad HTML from making it to the browser. OMG Ponies - thanks for posting that link to JudyX's post. Wodeh responded with a good solution about 3/4 of the way down that post - unfortunately, it was not entirely clear how to use the code that was posted.
The approach is to use a response filter on the page that contains the ReportViewer Control. The filter has access to the raw HTML that will be sent to the browser, and that provides the opportunity to modify the HTML directly without having to result to the new first column trick. In our Page_Load method, we set the Response.Filter property with the following code:
protected void Page_Load(object sender, EventArgs e)
{
Response.Filter = new CorrectSSRSIssuesResponseFilter(Response.Filter);
if (!IsPostBack) {
RenderReport();
}
}
The CorrectSSRSIssuesResponseFilter class is defined as follows, and is mostly based off of Wodeh's code from the post. The secret sauce is in the Write() method which uses the RegEx to wipe out the first style attribute:
using System;
using System.Collections.Generic;
using System.IO;
using System.Text;
namespace Reports
{
public class CorrectSSRSIssuesResponseFilter : Stream
{
private Stream _sink;
private StringBuilder Output = new StringBuilder();
public CorrectSSRSIssuesResponseFilter(Stream sink)
: base()
{
_sink = sink;
}
public CorrectSSRSIssuesResponseFilter()
: base()
{
_sink = new MemoryStream();
}
public override bool CanRead { get { return true; } }
public override bool CanSeek { get { return true; } }
public override bool CanWrite { get { return true; } }
public override void Flush()
{
_sink.Flush();
}
public override long Length
{
get { return _sink.Length; }
}
public override long Position
{
get
{ return _sink.Position; }
set
{ _sink.Position = value; }
}
public override int Read(byte[] buffer, int offset, int count)
{
return _sink.Read(buffer, offset, count);
}
public override long Seek(long offset, SeekOrigin origin)
{
return _sink.Seek(offset, origin);
}
public override void SetLength(long value)
{
_sink.SetLength(value);
}
public override void Write(byte[] buffer, int offset, int count)
{
string strBuffer = UTF8Encoding.UTF8.GetString(buffer, offset, count);
//A Closing HTML tag indicates the response object has finished recieving the entire content of the page
strBuffer = System.Text.RegularExpressions.Regex.Replace(
strBuffer
, "<TD style=\"[^\"]*\" style=(?<goodStyle>\"[^\"]*\")>"
, "<TD style=${goodStyle}>"
, System.Text.RegularExpressions.RegexOptions.Compiled
);
buffer = System.Text.Encoding.UTF8.GetBytes(strBuffer);
_sink.Write(buffer, offset, buffer.Length);
}
}
}

Answer 2

The solution isn't really a solution; it's a hack.
When the behavior appears, define a new first column. It should have the following attributes:
Empty - no text, no expression, etc
Set the minimum width (0.03125 inches)
If there is border styling on the other cells, style the right border of the new first cell to match while setting white/etc for the others.

Answer 3

This is a CSS styling issue. I have successfully implemented a fix for this in the past using the info from this post:
You basically have to locate the css file for reporting services (by default, located at C:\Program Files\Microsoft SQL Server\MSSQL.3\Reporting Services\ReportManager\Styles\ReportingServices.css on the report server), and add this class rule to it:
.DocMapAndReportFrame
{
min-height: 860px;
}

Answer 4

Try AsyncRendering="true" on the ReportViewer control.
With async rendering the generated HTML does not have two style tags – it uses a sytle tag for the height and all other styles are applied through a class attribute on the td element.

Answer 5

A much more simpler workaround fixed this issue in my case. Just added anoter row below the damaged one and set Visibility:Hidden = True.
Good luck!