Reader’s advice: iframe bug in Firefox
In Firefox there’re those annoying black 1px thin horizontal lines inside iframe. I haven’t found anything useful so far, even though the bug has been mentioned here and there.
So, the question is – what’s your experience with this nasty thingy? To make this even more interesting, the one who comes with the bulletproof solution will receive a copy of CSS Mastery, Dom Scripting or ppk on JavaScript.
Update
This error occures in Firefox 1.5.0.7, both Win and Mac.
Update 2
The workaround for the above is to set rule position: absolute to an iframe. No coordinates should be specified (left or top), and the parent element should not be set to position: relative, as this throws the iframe back to square one.
Ed’s note: The bug has nothing to do with the ‘rounding error’.
Update 3
You’ll have to register at Coolinarika.com to see the working example.
16 Comments
Why don’t I see them? I’ve never seen these lines before… is it a Mac thing maybe? I just did a test and set up two pages, called one into the other with an iframe, and I saw no weird lines… I’d love a chance at one of those books but I’ve really never seen those lines - they look nasty!
Comment (#) by Chris Wible — 6th October 2006.
Can you give online example? I’ve never seen this.
btw uri?…it means url?
Comment (#) by giurgia — 6th October 2006.
A live link so we can look at the html and css would be helful, but if this is the rounding error then you have a couple of choices redefine your unit of measurement for the iframe or offending container(s) or update your browser. Which version are you using? which OS?
Comment (#) by Steve — 6th October 2006.
http://www.positioniseverything.net/gecko/mozshift.html
assuming this is the problem here is some more detailed info on a workaround
Comment (#) by Steve — 6th October 2006.
@Steve: nope – not the same symptoms
Comment (#) by marko — 6th October 2006.
Problem solved! See the update.
Thanks everyone for help – too bad nobody won a book, but if you have a chance to read them, don’t miss ‘em
Comment (#) by marko — 6th October 2006.
can you tell me what “uri” menas?
Comment (#) by giurgia — 6th October 2006.
@giurgia: see Google results.
Comment (#) by marko — 6th October 2006.
@giurgia: http://en.wikipedia.org/wiki/Uniform_Resource_Identifier
Comment (#) by bojan — 6th October 2006.
First Time I’ve seen this “bug” … any online example to check? Cos’ all the iframes I’ve checked don’t have this; running 1.5.0.7 on XPSP2 here.
Comment (#) by Bramus! — 6th October 2006.
Yeah I remember this. I’ve been wondering where it has gone! Thanks for the workaround and for the heads-up to test IFRAME pages in older versions of Firefox.
Comment (#) by Mislav — 6th October 2006.
Bramus: you have to scroll down. I remember those lines would stay on the places where the bottom line of the iframe was before scrolling. After scrolling for a while you have a page similar to the screenshot above
Comment (#) by Mislav — 6th October 2006.
Try taking out the html/meta tags of the embedded page leaving only the markup, that should sort it
Comment (#) by James Broad — 6th October 2006.
Another spotting:
http://www.deveiate.org/projects/Linguistics/wiki/English
I’m seeing it in FF2 on the last code block only. It’s not even an iframe :(
Comment (#) by Mislav — 11th October 2006.
OK I double and triple-checked. The bug still happens on FF2 as well as 1.5.0.7 and it can happen not only on iframes, but on regular boxes that have scrollbars and bottom border. See my last link for an example. It’s quite nasty since I can’t get rid of it with the position workaround :(
Comment (#) by Mislav — 15th October 2006.
If iframe tag is not showing in mozilla firefox at the same time it is working well in IE and Opera, pls remove DOCTYPE tag with xhtml.
that problem can solved by removing doctype.
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"Comment (#) by Firos — 26th October 2006.
Sorry, the comment form is closed at this time, but if you have anything to say, please send me a message.