Clean up Firefox userChrome.css

Here I would like to describe how to clean up the userChrome.css and make it clearer.

If you have entered a lot of codes in it, it quickly becomes confusing and it takes longer to find a specific code if you want to change or even remove it.

That's why I think it's better to save each code individually.

Create userChrome.css

And here is an explanation of how to clean up this file and make it clearer.

To do this, we first go to the Firefox profile folder and open the chrome folder created there.

Next we create a new folder in the chrome folder:

We then name this folder. CSS

We then open this new folder CSS.

Now we create a new text file:

and give it a new name and a different file extension by surrounding it.

This name should give you a good idea of ​​what kind of code it is or what it has changed.

Let's take as an example:

Tab bar down.

Now we have to adjust the file extension to .css instead of .txt,

(For this you should display the hidden file extensions of Windows)
and then save them by closing the file and confirming the warning message.

Then it looks like this:
Tab bar down.css

As a check, the file type should now be: CSS file, and not txt file.

Now go to the chrome folder and open the userChrome.css file there.

Now mark one of the codes with the mouse and click on the right mouse button: Cut

You have to be very careful here so that the closing bracket } at the end of the code is included when you cut it.

Then go back to the CSS subfolder and open the existing file there: Tab bar down.css

and right-click: paste the code into it, and save the file.

So that this new file is also recognized and processed by Firefox, you have to create an @import rule in the userChrome.css file for it.

To do this, we open the userChrome.css file again and add the following text at the top:

@import url("CSS/Tableiste nach unten.css");

And as I described above, you do this with any other code that you already have in the userChrome.css file, or with any code that you want to create in the future.

So cut out the code..create a new file with the extension .css in the CSS subfolder, paste the code and finally enter the @import rule in the userChrome.css.

This is how it looks as an example for 2 codes in the CSS folder.

and so the required second @import rules in the userChrome.css

Then close the userChrome.css file again and save it.

If you are looking for a specific code, you simply go to the CSS subfolder and you can find it there more quickly based on the designations.

If you want to deactivate a code for a short time because you might want to test something, then open the userChrome.css file and simply comment out the respective @import rule.

It will look like that.

/* @import url("CSS/Tableiste nach unten.css"); */

After a restart of Firefox, this code is then disabled.

If you want to reactivate it, simply undo the commenting out by removing the characters /*..*/ and then restart Firefox as well.

And that's the end of cleaning up the userChrome.css file, and everything is much clearer.

Click the button below to load the content from ws-eu.amazon-adsystem.com.

load content

PHA+=