Monday, August 25, 2008

My RDLC covers my footer

Running IE7 I found a fun little issue regarding the RDLC ReportViewer in .NET and my footer as defined in my CSS Layout coming from my Master Page. Basically, the footer was appearing underneath the scroll bar from the iFrames (see the image to the right there).

What confused me at first was the fact that it was happening in IE7 and not IE6. An odd state of affairs at the baset of times.

My guess as to why, is that in IE6, scrollbars are generated INSIDE the element, and they changed that in IE7, but all of us CSS coders are still telling IE to perform according to the IE6 ruleset.

So, to accomplish this little bitty task, what I needed to do was put in another CSS class into the div that wrapped my ReportViewer (and the iFrame which it generates). Since my ReportViewer is running at 400 pixels, I just created the following CSS class and applied it to the DIV that wraps around the viewer:

.viewer { height:425px;}
A small and simple bit of CSS eh?

What that snippet of CSS does is push my footer down just that little bit necessary in order to make sure that it is always displayed (see picture to the left). Also, since it's just a class, then I can apply it only on those pages where necessary rather than on the MasterPage or worse having to create a new MasterPage.

Better yet, due to CSS's ability to stack, I can just append it to an existing DIV rather than having to create a brand new div.

No comments:

Blog Widget by LinkWithin