In Firefox 30 (Windows) "Style Editor" is adding breakes between lines in CSS files.
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 👍 4All Replies (18)
Anyone?
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
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.
@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.
Weird! There are two style files in style editor panel, but one of them has many redundant line breaks.
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.
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.
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...
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.
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).
FF should make an abstraction over it!
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.
What does that mean :) ?
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.
@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
Chosen Solution
Version 31.0 got this issue fixed! THANK YOU! Now FF Style Editor is once again usefull!!
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.
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! :(