Ugly lines scrolling iframes in Firefox

If you scroll a page that contains a web content iframe in Firefox (e.g. Worksite Info with a URL specified), you sometimes get ugly horizontal lines appearing at the bottom (see screenshot).

In a combination of googling and experimentation, I found that (a) this behaviour is somehow a side-effect of the navintratool being present, and (b) adding some padding to the iframe style seemed to resolve the issue.

Here is an example from an iframe with navIntraTool from Linktool that works correctly on scrolling:

<div class="portletBody">
<div class="navIntraTool"><a href='/portal/tool/66d76b5b-2763-4e68-96de-9189960187c9?Setup'>Setup</a></div>
<iframe
src="https://...(rest left out for brevity)" height="800" width="100%" frameborder="0" marginwidth="0" marginheight="0" scrolling="auto"
style="padding: 0.15em 0em 0em 0em;" />
</div>

In experimenting with changes to chef_iframe.vm in our local skin, I found 0.15em didn't work but 0.2em did, i.e.

padding: 0.2em 0em 0em 0em;

However, setting it to a larger value (e.g. 1em) causes the unwanted lines to come back again. The padding doesn't seem to make any visible difference to the positioning of the iframe.

There may be also be interactions with various styles used in chef_iframe - for experimenting I removed the divs other than portletBody and navIntraTool.

As rendering the iframes correctly in various browsers has been a fickle process in the past with odd effects surfacing in IE (esp. related to scrollbars), any change here probably needs some testing across multiple browsers.