Scheduled maintenance: Thursday, September 24, between 11:30am and 13:30pm UTC. This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn’t solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Lolu chungechunge lwabekwa kunqolobane. Uyacelwa ubuze umbuzo omusha uma udinga usizo.

Firefox horizontal scrollbar problem in version 36 and above (potential bug)

  • 16 uphendule
  • 4 zinale nkinga
  • 1732 views
  • Igcine ukuphendulwa ngu DJSigma

more options

I run a forum that uses Invision Power Board as the forum software. In Firefox 35.1 and below, when replying to a thread or starting a new thread, text would be correctly displayed like this: -

http://i.imgur.com/woze0ip.jpg

In Firefox 36, once you hit the right hand edge of the box that you type your post into, rather than it automatically moving down to the next line, it just continues on to the right and a horizontal scrollbar appears, like this: -

http://i.imgur.com/xkVP5Ck.jpg

I have tried upgrading to the latest beta version of Firefox 37, but the problem remains. I have also tried restarting Firefox in safe mode, with all extensions disabled, but it's the same. As soon as I downgrade back to 35.1 again, it works fine.

Is this a bug in Firefox? Is there an advanced setting I can change somewhere so that this doesn't happen?

Thanks!

Isisombululo esikhethiwe

Older versions of Firefox will ignore the white-space property. Other browsers should work (see the Browser Compatibility link above).

It sounds as though the style rules are associated with CKEditor. Since that could update and remove your changes, you might want to put them wherever Invision allows custom CSS, which could be a file named "custom.css" based on a little web searching.

.cke_skin_ips textarea {
    white-space: pre-wrap !important;
}
.cke_skin_ips textarea.cke_source {
    white-space: pre-wrap !important;
}
Funda le mpendulo ngokuhambisana nalesi sihloko 👍 1

All Replies (16)

more options

Maybe it would help to set this in about:config: plain_text.wrap_long_lines -> true

more options

Let's start with the basics;

Many site issues can be caused by corrupt cookies or cache.

  • Clear the Cache and
  • Remove Cookies
    Warning ! ! This will log you out of sites you're logged in to.

Type about:preferences<Enter> in the address bar.

  • Cookies; Select Privacy. Under History, select Firefox will Use Custom Settings. Press the button on the right side called Show Cookies. Use the search bar to look for the site. Note; There may be more than one entry. Remove All of them.
  • Cache; Select Advanced > Network. Across from Cached Web Content, Press Clear Now.

If there is still a problem, Start Firefox in Safe Mode {web link} While you are in safe mode;

Type about:preferences#advanced<Enter> in the address bar.

Under Advanced, Select General. Look for and turn off Use Hardware Acceleration.

Poke around safe web sites. Are there any problems?

Then restart.


Some added toolbar and anti-virus add-ons are known to cause Firefox issues. Disable All of them.

more options

finitarry said

Maybe it would help to set this in about:config: plain_text.wrap_long_lines -> true

Thanks for the reply, but it was already set as true.

more options

FredMcD said

Let's start with the basics;

Thanks for the reply too, but unfortunately this didn't help. The only thing I've tried that works so far is downgrading back to Firefox 35.1.

more options

I've called the big guys to help you. Good luck.

more options

FredMcD said

I've called the big guys to help you. Good luck.

Thanks a lot, Fred! Much appreciated. :)

more options

Is this a rich text editor area (i..e can have HTML code for formatting) or a normal text area like used on this forum?

I see a text resizer icon in the bottom right corner, so I assume that you can resize that text area. There might be JavaScript running that modifies the text area and that isn't working as expected.

What are the CSS rules for the text area and its containing (DIV) element? If this can happen then it is likely that there isn't a maximum width for the containing container.

more options

cor-el said

Is this a rich text editor area (i..e can have HTML code for formatting) or a normal text area like used on this forum? I see a text resizer icon in the bottom right corner, so I assume that you can resize that text area. There might be JavaScript running that modifies the text area and that isn't working as expected. What are the CSS rules for the text area and its containing (DIV) element? If this can happen then it is likely that there isn't a maximum width for the containing container.

I'm afraid I can't answer all of your questions, but I'll try my best.

You can switch between 2 modes when making posts - a rich text mode and a "BB Code" mode where you have to manually add BB Code to format things. The issue occurs in both modes.

The resizer icon allows you to adjust the height of the box that you post in. This works in either mode and resizing the box makes no difference as far as this issue is concerned.

Your last question I can't answer unfortunately. I can create an account for you on my forum if you want to take a better look at this though.

more options

We've had a couple other threads on issues with text entry in Firefox 36, in one case the space key didn't work and in another, the Enter key didn't start a new line, it just added a space. "Something" changed, but these symptoms are so disparate that it's hard to track it down...

more options

jscher2000 said

We've had a couple other threads on issues with text entry in Firefox 36, in one case the space key didn't work and in another, the Enter key didn't start a new line, it just added a space. "Something" changed, but these symptoms are so disparate that it's hard to track it down...

Thanks for the reply. I'll happily set up an account on my forum for someone to use if they want to test this, if that helps.

more options

What is the white-space rule for the textarea? Prior to version 36.0, Firefox apparently was ignoring this property for textarea controls.

https://developer.mozilla.org/docs/Web/CSS/white-space#Browser_compatibility

The native behavior is pre-wrap and using pre will prevent wrapping.

Similar thread where I got hands on: Word wrap problems in 36.0

more options

Here's the relevant code: -

http://pastebin.com/092mSzbL

It seems that the pre/pre-wrap thing you mentioned is the issue. Could you tell me what changes I would need to make to make it work properly please?

more options

The two instances of white-space: pre; would have to be changed to white-space: pre-wrap;

.cke_skin_ips textarea.cke_source {
    font-family: "Courier New",monospace;
    font-size: small;
    background-color: #FFF;
    white-space: pre; -> white-space: pre-wrap;
}

.cke_skin_ips textarea.cke_source {
}
.cke_skin_ips textarea {
    white-space: pre; -> white-space: pre-wrap;
}
more options

Thanks. The problem I have is that I don't know how to find the file or template where these changes should be made. How would I do that?

Also, would making this change affect users of other browsers, including older versions of Firefox?

Thanks again!

more options

Isisombululo Esikhethiwe

Older versions of Firefox will ignore the white-space property. Other browsers should work (see the Browser Compatibility link above).

It sounds as though the style rules are associated with CKEditor. Since that could update and remove your changes, you might want to put them wherever Invision allows custom CSS, which could be a file named "custom.css" based on a little web searching.

.cke_skin_ips textarea {
    white-space: pre-wrap !important;
}
.cke_skin_ips textarea.cke_source {
    white-space: pre-wrap !important;
}
more options

Thanks for the reply! With the help given here and over on Invision Modding, I was able to get this resolved.

For any others who have the same issue, you need to go into the Admin CP - Look & Feel - then select the affected skin and add the code in jscher2000's post above to the end of the ipb_ckeditor.css file and hit Save.