Unnecessary CSS Expressions

A full-page-body iframe was being sized correctly in IE but incorrectly in Firefox – it seemed to be just the default arbitrary small iframe size. Turns out the iframe had its width and height set by CSS expressions, so that it could fill up the full size of the document, minus sidebars, headers, etc. But CSS expressions aren’t supported in Firefox 2.

The solution for the width was simple, though, because the page design is fixed-width. There’s no reason to include a CSS expression when you can just set the width to an exact numeric value. It’s not like this code is reused in other locations that might have different sizes.

The height did still need to be dynamic, though, so JavaScript was the solution here. The document.body.clientHeight property seemed to be the most reliable way to get the window height, so I created some JavaScript code to recalculate the iframe height on page load and on resize. Just used a simple method to unobtrusively add the onLoad handler, and an analogous method for onResize.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: