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

In Firefox 30 (Windows) "Style Editor" is adding breakes between lines in CSS files.

more options

Hello, After upgrading Firefox to v30 Style Editor started adding line breaks in CSS files. It makes working with CSS files very annoying.

Screenshot: http://s10.postimg.org/5v6kd7cw9/firefox_style_editor_went_wrong.png

Hello, After upgrading Firefox to v30 Style Editor started adding line breaks in CSS files. It makes working with CSS files very annoying. Screenshot: http://s10.postimg.org/5v6kd7cw9/firefox_style_editor_went_wrong.png

Chosen solution

Version 31.0 got this issue fixed! THANK YOU! Now FF Style Editor is once again usefull!!

Read this answer in context 👍 4

All Replies (18)

more options

I'm not seeing extra lines in the Style Editor in Firefox 30 or nay other version.

Does this happen with files that you open in the Scratchpad?


Start Firefox in Safe Mode to check if one of the extensions (Firefox/Tools > Add-ons > Extensions) or if hardware acceleration is causing the problem.

  • Switch to the DEFAULT theme: Firefox/Tools > Add-ons > Appearance
  • Do NOT click the Reset button on the Safe Mode start window
more options

I have same issue. It seems that it doesn nto appear on all websites. As far I spotted it on all my self hosted WordPress sites and few other random pages.

more options

@cor-el Well yes, this problem still exists even in safe mode.

I've noticed that this happens when file is saved with CRLF (Windows) end of line. After converting EOL to LF problem dissappears. So i think it's a bug and you can reproduce it easly.

more options

Weird! There are two style files in style editor panel, but one of them has many redundant line breaks.

more options

You would have to save the files and check their content with an Hex editor/viewer program to see what is used for the line endings.

more options

This problem is making style editor useless to me, because it actually changes the css file formatting. I've attached an image with the same file on notepad++ and firefox 30 style editor. You can see that style editor changes the format, adding line breaks, and when it saves that file it saves it with the new line breaks. Also, when I'm inspecting an element and I click on the style definition, It does not jump to the correct line on the css file. Most of the times, it jumps to the top of the file. I assume that line numbering is also getting messed up by the new format. Please do revert/fix this.

more options

Ooops... It gets worse! Just by typing a single character in style editor (even a space), the webpage gets all messed up... You guys really need to fix this...

more options

I have also been experiencing the same problem. This never used to happen. I have been using the Firefox Inspect Element in my workflow for sometime now. It is an excellent tool I rely on every time I am coding, which is often. Then one day, after an update, this tool is now useless to me.

I used to make style changes in this style editor and the ctrl+C / ctrl+V the file into my text editor. That way, I get a preview in the browser and paste over my file when happy. Then one day I did this and there's added empty space and a very messy looking stylesheet. Now this tool is useless for me. I actually much prefer Firefox Inspect Element instead of Firebug which is ugly looking, finicky to edit and sluggish.

For me, it only seems to apply to sites you are working on locally. When the CSS goes onto a server, things seem fine again. However, not all sites are on a server when I am in the middle of developing them.

Can anyone advise as for me, this is a major disruption and it is not resolved I will have to change browser.

more options

I have the same problem using FIrefox 30 on Linux.

For me the problem only happens with files that use Windows encoding (i.e. CRLF rather than just LF).

more options

FF should make an abstraction over it!

more options

Maybe this happens if not all CSS files use the same line ending convention and that the first files that show correctly have a LF line ending and that files in between that have the double line spacing have CR/LF line endings.

more options

What does that mean :) ?

more options

cor-el, this is a very plausible explanation as we work in a mixed Windows/Linux environment so there is a good chance that some files have CRLF line endings and other files have LF line endings.

AlySebastien, please see http://en.wikipedia.org/wiki/Newline for more information about line terminators. Basically they are just different ways of encoding a new line in a text file.

more options

@cor-el OH REALLY GENIUS? I just wrote about it few weeks ago! And this is a bug and it should be fixed. In the meanwhile i've switched to Chrome, which has developer tools that are working way better.

It seems that Google is more interested in developers community than Mozilla.

Modified by radoos

more options

Chosen Solution

Version 31.0 got this issue fixed! THANK YOU! Now FF Style Editor is once again usefull!!

more options

It is now working a lot better after an update to Firefox 31.0. However, the first CSS declaration for each styled element is indented by two spaces. Still annoying. Shame.

more options

Actually, working with this for two minutes or so reveals that if you copy from the style editor and paste in to your project, the CSS is still mangled. Random Indentation City! :(