Page 1 of 1

PRE tags and FF4 [Workaround found]

Posted: Mon Apr 25, 2011 4:46 am
by Uly
I recently moved to Firefox 4 and noticed the behavior of pre tags is different, and worse, than Firefox 2's.

Firefox 2:

Image

Firefox 4:

Image

Instead of each pre box with its own scrollbar, I get a giant scrollbar for the whole page, that makes all the text hard to read (one has to scroll back and forth).

I know it's the browser's fault (or mine for upgrading, but it was about time!), just wondering if someone knows what's up with this.

Re: PRE tags and FF4

Posted: Mon Apr 25, 2011 7:51 pm
by UncombedCoconut
Disclaimer: I have no useful post-1995 web design knowledge.
I upgraded the box I'm using from FF 3.6.x to FF 4.0 and saw the same misbehavior. I thought the second item here might be relevant, even if it mentions different elements. But once I'd installed Firebug and restarted FF to inspect the code box, the darned browser put the scrollbars where we want them.
So... does this happen after a FF restart? Does Firebug call the box a <pre> with the CSS overflow:auto attribute as expected?

Trying with a clean profile probably won't help, but it's tempting to suggest it.

Re: PRE tags and FF4

Posted: Tue Apr 26, 2011 2:57 am
by Uly
UncombedCoconut wrote:Trying with a clean profile probably won't help, but it's tempting to suggest it.
After my bad experience with Firefox 3, I learned that when upgrading, always start with a new profile. So I did that and started from the ground up, I have yet to reinstall all my plugins.
UncombedCoconut wrote:I thought the second item here might be relevant, even if it mentions different elements. But once I'd installed Firebug and restarted FF to inspect the code box, the darned browser put the scrollbars where we want them.
Thanks, so perhaps this is a problem that can be solved with the Stylish plugin? It's one I have yet to reinstall, but if this is the case then I'll provide a fix.

Re: PRE tags and FF4

Posted: Tue Apr 26, 2011 9:53 am
by UncombedCoconut
Uly wrote:Thanks, so perhaps this is a problem that can be solved with the Stylish plugin? It's one I have yet to reinstall, but if this is the case then I'll provide a fix.
I can't confirm or deny that. I never installed "Stylish", and I can no longer reproduce the problem. But I absolutely did see the problem occur, on the first run...

Re: PRE tags and FF4

Posted: Wed Apr 27, 2011 11:21 am
by Uly
Thanks. Alright, I found a workaround with Stylish that solves the problem, here's the code:
@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("www.open-chess.org") {

pre {
width:512px !important;
} 

}
Curiously, limiting the width makes the scrollbars appear correctly, though I guess other users with this problem would need higher width so their boxes aren't too thin.

Re: PRE tags and FF4 [Workaround found]

Posted: Wed Jun 08, 2011 10:20 pm
by Peter C
I'd go for reporting it as a bug, as that's definitely not desired behavior. Going for something like

Code: Select all

pre {
    overflow: scroll;
} 
might work.

Re: PRE tags and FF4 [Workaround found]

Posted: Thu Jun 09, 2011 12:19 am
by Uly
I'm going to test it on this thread:
This is a long line of text. This is a long line of text. This is a long line of text. This is a long line of text.
For some reason overflow: scroll; isn't working, a scrollbar appears but it is blank, so one has to scroll the whole page. Do you mean it's a bug in Firefox 4?

Well, width:512px !important; works just fine without problems.

Screenshot with overflow: scroll;:

Image

(Odd scrollbars appear but they do nothing)