Hi there, I am using ReportViewer control to display my reports. Some of the fields in the report are hyperlinks. How can I change a:hover behavior so that the background color of the fields would be red or something else to remind users that the field is clickable? I can thinking of the following possible ways to do this, but I need some help with the detail: 1. passing css to iframe generated by ReportViewer control 2. change css used by Reporting Services/ReportServer/ReportManager. which file should be updated: ReportingServices.css, RSWebParts.css or HtmlViewer.css? Anybody has done something similar before? Thanks for your help!

Hello LynLyn, Thanks for your detail description. CSS can be overwritten with more accurate path. For example, in the following HTML segment, <div class="content"> <span><a href="#">link</a></span> </div> We have following two CSS class. div a:hover { text-decoration: none } div.content a:hover { text-decoration: overline } When we hover on the link, it will show the line over the text. That means the first CSS is overwritten by the second one. Back to this issue, I suggest that we can add a new CSS file to the report server and write down the customized CSS to overwrite the original modification. I hope it is helpful to you. If you have any questions about this issue, please contact me. Regards, EdwardEdward Zhu TechNet Community Support

Hi Edward, Thank you very much for looking into my question and give me some advice. However I need more detail about your approach. 1. Should I put the new CSS file into our report server styles directory (say c:\MSSQL\MSSQL.3\Reporting Services\ReportServer\Styles)? 2. How to invoke this CSS by report server? Initially I made the changes HtmlViewer.css and updated rsreportserver.config to refer to HtmlViewer.css as below: <Configuration> <HTMLViewerStyleSheet>HtmlViewer</HTMLViewerStyleSheet> </Configuration> I thought this would change a:hover behavior in the reports. But as I read more, I become understanding that this would impact report toolbar only, not the report body. Anyway the changes in HtmlViewer.css was NOT reflected when viewing the reports. Did I do something wrong? Is this still the place to put the new CSS file? 3. The report cell is rendered as <div class="r11"><a href="something">text</a></div> I am not sure how class='r11' is inserted into the div. The css file revealed from the debug tool is: https://ourServer/Reserved.ReportViewerWebControl.axd?ReportSession=aep0bv553tljxi5521p2hu55&ControlID=6b25815cd67d4015ad79fe502cfa99ef&Culture=1033&UICulture=1033&ReportStack=1&OpType=ReportArea&Controller=ReportViewer1&PageNumber=1&ZoomMode=Percent&ZoomPct=100&ReloadDocMap=true&SearchStartPage=0&LinkTarget=_top Does this mean the CSS file is compiled into the ReportViewer control? Will the new CSS file placede on the Reporting Server side achieve what we want? I greatly appreciate your time and help!

Hello LynLyn, Thanks for your response. It provided me more information. From your description, I deduce that the version of reporting service is 2005. I checked the report.aspx file, but could not find any the entry to allow you add the extra CSS. Review the page source code in the client side, and find out that the file /Reports/styles/ReportingServices.css will be loaded in the page. Therefore, I suggest that we need modify the file /Reports/styles/ReportingServices.css to add extra CSS to overwrite the original style. For the third question, the class r11 is defined in the reporting server. When we applied some theme of the report, then it will be set based on different theme. In addition, the .axd is an HTTP handler which is compiled in a DLL file. All resources via the AXD handler are from the resource DLL file, which cannot be modified outside of the DLL. Therefore, we have the only way to modify the file /Reports/styles/ReportingServices.css. Regards, EdwardEdward Zhu TechNet Community Support

Hi Edward, The expected effect of CSS is very simple, just to change background color of a cell to remind users that the cell is clickable [div.r11 a:hover {background-color:Orange}]. I tested the stylesheet modifification with a simple html file and it worked fine. However the same modification in ReportingServices.css did not make any difference on the behavior of a:hover. An iframe tag is generated by Report.aspx. <iframe frameborder="0" style="width:100%;height:100%;display:inline;" name="ReportFramectl140" id="ReportFramectl140" class="DocMapAndReportFrame" src="/Reports/Reserved.ReportViewerWebControl.axd?OpType=DocMapReport&amp;ClientController=ctl140&amp;ReportUrl=%2fReports%2fReserved.ReportViewerWebControl.axd%3fReportSession%3djkrjno55bpckw3njp4hq2pbg%26ControlID%3d32f39f6e417c435cbc595984fa2e1661%26Culture%3d1033%26UICulture%3d9%26ReportStack%3d1%26OpType%3dReportArea%26Controller%3dctl140%26PageNumber%3d1%26ZoomMode%3dPercent%26ZoomPct%3d100%26ReloadDocMap%3dtrue%26SearchStartPage%3d0%26LinkTarget%3d_top"> </iframe> I started to double that there was an easy solution for this request. Even if it works for Report.aspx, it is not exactly what I want. I am using a reportviewer control in ASP.NET page to retrieve the report. Could you test your solution in your testing evironment? If it is to take too much of your time, please ignore my request. Thanks!

Hi Edward, You are right. We are still using reporting service 2005. Are you saything that reporting service 2008 or 2012 would allow me add extra CSS. BTW, you mentioned report.aspx. Is it the same as ReportServer/Pages/ReportViewer.aspx in 2005? ReportingServices.css in 2005 is under c:\MSSQL\MSSQL.3\Reporting Services\ReportManager\Styles. I made the changes to it. Now do I need to update rsreportserver.config to refer to it? Or is it invoked automatically? If it is invoked automatically, I still don't see the changes.... Thank you.

Hello LynLyn, I checked the Reporting Service 2012 just now, and am sad to find that we are unable to add the custom CSS file on that version. Therefore, I consider that my previous solution may be the only possible solution. The report.aspx file is not same as ReportServer/Pages/ReportViewer.aspx file. When you review the report in report manager, the page URL should be: http://localhost/Reports/Pages/Report.aspx?ItemPath=<report path>. The file is located at C:\Program Files\Microsoft SQL Server\MSSQL.3\Reporting Services\ReportManager\Pages by default. If you modify the stylesheet, you do not need to change rsreportserver.config file, and it will automatically apply the changes. If you still encounter the problem, please post the DOM structure of the node in HTML file, the expected effect of CSS, and the stylesheet modification you did. Therefore, we can find out the possible solution for you. Regards, EdwardEdward Zhu TechNet Community Support

Hello LynLyn, Thanks for your response. I tried it in the web application, but it is quite different with your stylesheet class. I cannot provide you a detail solution. However, I can provide you a general troubleshooting steps for this issue. Load the web page in IE 9 browser, and click F12 to open the Develop tool bar.Click the cursor icon on the toolbar to figure out the link you want to modify the CSS style.Review the Style tab to see whether the CSS modification [div.r11 a:hover {background-color:Orange}] is applied. If we see it is outlined, then it means the style is overwritten by other styles.If you encounter the above issue, we have two solutions to solve this problem. First, we can define more exact CSS selector, for example, [table tr td div.r11 a:hover {backgroun-color: Orange}] if the link is in a table. The other solution is to modify the custom CSS stylesheet with !important to force the style applied. For example, try to use [div.r11 a:hover {background-color:Orange!important}] to see whether it works. I hope it is helpful to this problem. Regards, EdwardEdward Zhu TechNet Community Support

Edward, Thanks for your time. But i think it is not a problem with the Stylesheet modification. ReportingServices.css is not the stylesheet being invoked for the report body. It is somethine embedded in the resource DLL file as you mentioned before. Thank you. I think I am going to give up on this.

I am having the same issue. Updating HtmlViewer.css will not affect reports because Reporting Services somehow caches older version of the css. The question is, how do we make RS thow away the old cached version, and use the updated HtmlViewr.css file.