How to override the CSS of a site in Firefox with userContent.css?

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}

In Mozilla Firefox, I want to create userContent.css which overrides the CSS of a site.

Where should I create the file?

Could you please describe it based on Windows 7?

edited Feb 4 '18 at 8:29

unor

1,95911844

asked Aug 4 '11 at 8:30

Rauf

1,64072132

add a comment |

In Mozilla Firefox, I want to create userContent.css which overrides the CSS of a site.

Where should I create the file?

Could you please describe it based on Windows 7?

edited Feb 4 '18 at 8:29

unor

1,95911844

asked Aug 4 '11 at 8:30

Rauf

1,64072132

add a comment |

In Mozilla Firefox, I want to create userContent.css which overrides the CSS of a site.

Where should I create the file?

Could you please describe it based on Windows 7?

edited Feb 4 '18 at 8:29

unor

1,95911844

asked Aug 4 '11 at 8:30

Rauf

1,64072132

In Mozilla Firefox, I want to create userContent.css which overrides the CSS of a site.

Where should I create the file?

Could you please describe it based on Windows 7?

firefox css

edited Feb 4 '18 at 8:29

unor

1,95911844

asked Aug 4 '11 at 8:30

Rauf

1,64072132

edited Feb 4 '18 at 8:29

unor

1,95911844

asked Aug 4 '11 at 8:30

Rauf

1,64072132

edited Feb 4 '18 at 8:29

unor

1,95911844

edited Feb 4 '18 at 8:29

unor

1,95911844

edited Feb 4 '18 at 8:29

unor

1,95911844

asked Aug 4 '11 at 8:30

Rauf

1,64072132

asked Aug 4 '11 at 8:30

Rauf

1,64072132

asked Aug 4 '11 at 8:30

Rauf

1,64072132

add a comment |

2 Answers
2

active

oldest

votes

Open Firefox and press Alt to show the top menu, then click on Help → Troubleshooting Information

Click the Show Folder button beside the Profile Folder entry

Create a folder named chrome in the directory that opens

In the chrome folder create a css file with the name userContent.css

Copy the following code to userContent.css, replacing "example.com" with the website you want to modify and your own custom CSS, and restart Firefox:

@-moz-document domain(example.com) {

    img { opacity: 0.05 !important; }

}

edited Sep 29 '17 at 19:04

mirabilos

256212

answered Aug 5 '11 at 4:48

Rauf

1,64072132

6

A small update / modification for step 1; the Troubleshooting Information opens up a link about:support and in my Firefox (v20 nightly build on Ubuntu) it has an entry named "Profile directory" with a button "Open Directory" which opens up the profile directory /home/tripleee/.mozilla/firefox/asdf1234.default/ in Nautilus.

– tripleee
Jan 3 '13 at 10:38

5

You can remove @-moz-document domain("...") to apply the style to every pages.

– Nicolas
May 30 '13 at 8:26

2

@Septagram I think it's just always been that way… as I remember, chrome could also contain userChrome.css, which would style the browser interface ("chrome").

– sam
Sep 27 '14 at 18:05

4

One small note, make sure that the folder you create is named, "chrome", with a lowercase 'c', otherwise it will not work on Linux.

– Oliver Burt
Dec 22 '16 at 14:04

3

It it is necessary to restart Firefox for it to take effect.

– Peter Mortensen
Jul 18 '18 at 8:32

|
show 5 more comments

There was an old extension called ChromEdit, which added a simple button to easily open user CSS for editing.

This was apparently compromised or withdrawn. Stylish was an alternative, but similarly this now appears to be defunct.

At the moment you just have to remember where the file is supposed to go.

edited Jan 26 at 15:40

answered May 24 '13 at 15:59

OrangeDog

528416

I thought I'd got ChromEdit from the official list, but OK.

– OrangeDog
Jul 2 '15 at 19:57

9

Based on recent reviews, Stylish should probably be avoided.

– KlaymenDK
May 31 '17 at 8:59

1

An extension is not the same as an actual user stylesheet. That's why Chrome is worthless garbage now.

– Synetech
Jul 9 '17 at 23:02

1

@Synetech what are you talking about? This extension adds a button to open the stylesheet for editing.

– OrangeDog
Jul 9 '17 at 23:08

Stylish didn't work for me. When I searched for help I found a forum topic in which a user said most users of Stylish have moved to Stylus because of better user support and more continual updates. Stylus is a fork of Stylish. Stylus worked for me without the need to restart Firefox. Usage of the plug-in is simple - navigate to the page you want to style, click the app icon at top-right of your browser, choose whether you want to apply styles to the current URL only or whole domain and write your styles. When you visit again, the icon shows number of styles being applied by the plugin.

– youcantryreachingme
Oct 3 '18 at 23:14

|
show 2 more comments

protected by Community♦ Dec 23 '16 at 11:29

Thank you for your interest in this question.
Because it has attracted low-quality or spam answers that had to be removed, posting an answer now requires 10 reputation on this site (the association bonus does not count).

Would you like to answer one of these unanswered questions instead?

2 Answers
2

active

oldest

votes

2 Answers
2

active

oldest

votes

Open Firefox and press Alt to show the top menu, then click on Help → Troubleshooting Information

Click the Show Folder button beside the Profile Folder entry

Create a folder named chrome in the directory that opens

In the chrome folder create a css file with the name userContent.css

Copy the following code to userContent.css, replacing "example.com" with the website you want to modify and your own custom CSS, and restart Firefox:

@-moz-document domain(example.com) {

    img { opacity: 0.05 !important; }

}

edited Sep 29 '17 at 19:04

mirabilos

256212

answered Aug 5 '11 at 4:48

Rauf

1,64072132

6

A small update / modification for step 1; the Troubleshooting Information opens up a link about:support and in my Firefox (v20 nightly build on Ubuntu) it has an entry named "Profile directory" with a button "Open Directory" which opens up the profile directory /home/tripleee/.mozilla/firefox/asdf1234.default/ in Nautilus.

– tripleee
Jan 3 '13 at 10:38

5

You can remove @-moz-document domain("...") to apply the style to every pages.

– Nicolas
May 30 '13 at 8:26

2

@Septagram I think it's just always been that way… as I remember, chrome could also contain userChrome.css, which would style the browser interface ("chrome").

– sam
Sep 27 '14 at 18:05

4

One small note, make sure that the folder you create is named, "chrome", with a lowercase 'c', otherwise it will not work on Linux.

– Oliver Burt
Dec 22 '16 at 14:04

3

It it is necessary to restart Firefox for it to take effect.

– Peter Mortensen
Jul 18 '18 at 8:32

|
show 5 more comments

Open Firefox and press Alt to show the top menu, then click on Help → Troubleshooting Information

Click the Show Folder button beside the Profile Folder entry

Create a folder named chrome in the directory that opens

In the chrome folder create a css file with the name userContent.css

Copy the following code to userContent.css, replacing "example.com" with the website you want to modify and your own custom CSS, and restart Firefox:

@-moz-document domain(example.com) {

    img { opacity: 0.05 !important; }

}

edited Sep 29 '17 at 19:04

mirabilos

256212

answered Aug 5 '11 at 4:48

Rauf

1,64072132

6

A small update / modification for step 1; the Troubleshooting Information opens up a link about:support and in my Firefox (v20 nightly build on Ubuntu) it has an entry named "Profile directory" with a button "Open Directory" which opens up the profile directory /home/tripleee/.mozilla/firefox/asdf1234.default/ in Nautilus.

– tripleee
Jan 3 '13 at 10:38

5

You can remove @-moz-document domain("...") to apply the style to every pages.

– Nicolas
May 30 '13 at 8:26

2

@Septagram I think it's just always been that way… as I remember, chrome could also contain userChrome.css, which would style the browser interface ("chrome").

– sam
Sep 27 '14 at 18:05

4

One small note, make sure that the folder you create is named, "chrome", with a lowercase 'c', otherwise it will not work on Linux.

– Oliver Burt
Dec 22 '16 at 14:04

3

It it is necessary to restart Firefox for it to take effect.

– Peter Mortensen
Jul 18 '18 at 8:32

|
show 5 more comments

Open Firefox and press Alt to show the top menu, then click on Help → Troubleshooting Information

Click the Show Folder button beside the Profile Folder entry

Create a folder named chrome in the directory that opens

In the chrome folder create a css file with the name userContent.css

Copy the following code to userContent.css, replacing "example.com" with the website you want to modify and your own custom CSS, and restart Firefox:

@-moz-document domain(example.com) {

    img { opacity: 0.05 !important; }

}

edited Sep 29 '17 at 19:04

mirabilos

256212

answered Aug 5 '11 at 4:48

Rauf

1,64072132

Open Firefox and press Alt to show the top menu, then click on Help → Troubleshooting Information

Click the Show Folder button beside the Profile Folder entry

Create a folder named chrome in the directory that opens

In the chrome folder create a css file with the name userContent.css

Copy the following code to userContent.css, replacing "example.com" with the website you want to modify and your own custom CSS, and restart Firefox:

@-moz-document domain(example.com) {

    img { opacity: 0.05 !important; }

}

edited Sep 29 '17 at 19:04

mirabilos

256212

answered Aug 5 '11 at 4:48

Rauf

1,64072132

edited Sep 29 '17 at 19:04

mirabilos

256212

edited Sep 29 '17 at 19:04

mirabilos

256212

edited Sep 29 '17 at 19:04

mirabilos

256212

answered Aug 5 '11 at 4:48

Rauf

1,64072132

answered Aug 5 '11 at 4:48

Rauf

1,64072132

answered Aug 5 '11 at 4:48

Rauf

1,64072132

6

A small update / modification for step 1; the Troubleshooting Information opens up a link about:support and in my Firefox (v20 nightly build on Ubuntu) it has an entry named "Profile directory" with a button "Open Directory" which opens up the profile directory /home/tripleee/.mozilla/firefox/asdf1234.default/ in Nautilus.

– tripleee
Jan 3 '13 at 10:38

5

You can remove @-moz-document domain("...") to apply the style to every pages.

– Nicolas
May 30 '13 at 8:26

2

@Septagram I think it's just always been that way… as I remember, chrome could also contain userChrome.css, which would style the browser interface ("chrome").

– sam
Sep 27 '14 at 18:05

4

One small note, make sure that the folder you create is named, "chrome", with a lowercase 'c', otherwise it will not work on Linux.

– Oliver Burt
Dec 22 '16 at 14:04

3

It it is necessary to restart Firefox for it to take effect.

– Peter Mortensen
Jul 18 '18 at 8:32

|
show 5 more comments

6

A small update / modification for step 1; the Troubleshooting Information opens up a link about:support and in my Firefox (v20 nightly build on Ubuntu) it has an entry named "Profile directory" with a button "Open Directory" which opens up the profile directory /home/tripleee/.mozilla/firefox/asdf1234.default/ in Nautilus.

– tripleee
Jan 3 '13 at 10:38

5

You can remove @-moz-document domain("...") to apply the style to every pages.

– Nicolas
May 30 '13 at 8:26

2

@Septagram I think it's just always been that way… as I remember, chrome could also contain userChrome.css, which would style the browser interface ("chrome").

– sam
Sep 27 '14 at 18:05

4

One small note, make sure that the folder you create is named, "chrome", with a lowercase 'c', otherwise it will not work on Linux.

– Oliver Burt
Dec 22 '16 at 14:04

3

It it is necessary to restart Firefox for it to take effect.

– Peter Mortensen
Jul 18 '18 at 8:32

A small update / modification for step 1; the Troubleshooting Information opens up a link about:support and in my Firefox (v20 nightly build on Ubuntu) it has an entry named "Profile directory" with a button "Open Directory" which opens up the profile directory /home/tripleee/.mozilla/firefox/asdf1234.default/ in Nautilus.

– tripleee
Jan 3 '13 at 10:38

You can remove @-moz-document domain("...") to apply the style to every pages.

– Nicolas
May 30 '13 at 8:26

@Septagram I think it's just always been that way… as I remember, chrome could also contain userChrome.css, which would style the browser interface ("chrome").

– sam
Sep 27 '14 at 18:05

One small note, make sure that the folder you create is named, "chrome", with a lowercase 'c', otherwise it will not work on Linux.

– Oliver Burt
Dec 22 '16 at 14:04

It it is necessary to restart Firefox for it to take effect.

– Peter Mortensen
Jul 18 '18 at 8:32

|
show 5 more comments

There was an old extension called ChromEdit, which added a simple button to easily open user CSS for editing.

This was apparently compromised or withdrawn. Stylish was an alternative, but similarly this now appears to be defunct.

At the moment you just have to remember where the file is supposed to go.

edited Jan 26 at 15:40

answered May 24 '13 at 15:59

OrangeDog

528416

I thought I'd got ChromEdit from the official list, but OK.

– OrangeDog
Jul 2 '15 at 19:57

9

Based on recent reviews, Stylish should probably be avoided.

– KlaymenDK
May 31 '17 at 8:59

1

An extension is not the same as an actual user stylesheet. That's why Chrome is worthless garbage now.

– Synetech
Jul 9 '17 at 23:02

1

@Synetech what are you talking about? This extension adds a button to open the stylesheet for editing.

– OrangeDog
Jul 9 '17 at 23:08

Stylish didn't work for me. When I searched for help I found a forum topic in which a user said most users of Stylish have moved to Stylus because of better user support and more continual updates. Stylus is a fork of Stylish. Stylus worked for me without the need to restart Firefox. Usage of the plug-in is simple - navigate to the page you want to style, click the app icon at top-right of your browser, choose whether you want to apply styles to the current URL only or whole domain and write your styles. When you visit again, the icon shows number of styles being applied by the plugin.

– youcantryreachingme
Oct 3 '18 at 23:14

|
show 2 more comments

There was an old extension called ChromEdit, which added a simple button to easily open user CSS for editing.

This was apparently compromised or withdrawn. Stylish was an alternative, but similarly this now appears to be defunct.

At the moment you just have to remember where the file is supposed to go.

edited Jan 26 at 15:40

answered May 24 '13 at 15:59

OrangeDog

528416

I thought I'd got ChromEdit from the official list, but OK.

– OrangeDog
Jul 2 '15 at 19:57

9

Based on recent reviews, Stylish should probably be avoided.

– KlaymenDK
May 31 '17 at 8:59

1

An extension is not the same as an actual user stylesheet. That's why Chrome is worthless garbage now.

– Synetech
Jul 9 '17 at 23:02

1

@Synetech what are you talking about? This extension adds a button to open the stylesheet for editing.

– OrangeDog
Jul 9 '17 at 23:08

Stylish didn't work for me. When I searched for help I found a forum topic in which a user said most users of Stylish have moved to Stylus because of better user support and more continual updates. Stylus is a fork of Stylish. Stylus worked for me without the need to restart Firefox. Usage of the plug-in is simple - navigate to the page you want to style, click the app icon at top-right of your browser, choose whether you want to apply styles to the current URL only or whole domain and write your styles. When you visit again, the icon shows number of styles being applied by the plugin.

– youcantryreachingme
Oct 3 '18 at 23:14

|
show 2 more comments

There was an old extension called ChromEdit, which added a simple button to easily open user CSS for editing.

This was apparently compromised or withdrawn. Stylish was an alternative, but similarly this now appears to be defunct.

At the moment you just have to remember where the file is supposed to go.

edited Jan 26 at 15:40

answered May 24 '13 at 15:59

OrangeDog

528416

There was an old extension called ChromEdit, which added a simple button to easily open user CSS for editing.

This was apparently compromised or withdrawn. Stylish was an alternative, but similarly this now appears to be defunct.

At the moment you just have to remember where the file is supposed to go.

edited Jan 26 at 15:40

answered May 24 '13 at 15:59

OrangeDog

528416

edited Jan 26 at 15:40

answered May 24 '13 at 15:59

OrangeDog

528416

answered May 24 '13 at 15:59

OrangeDog

528416

answered May 24 '13 at 15:59

OrangeDog

528416

I thought I'd got ChromEdit from the official list, but OK.

– OrangeDog
Jul 2 '15 at 19:57

9

Based on recent reviews, Stylish should probably be avoided.

– KlaymenDK
May 31 '17 at 8:59

1

An extension is not the same as an actual user stylesheet. That's why Chrome is worthless garbage now.

– Synetech
Jul 9 '17 at 23:02

1

@Synetech what are you talking about? This extension adds a button to open the stylesheet for editing.

– OrangeDog
Jul 9 '17 at 23:08

Stylish didn't work for me. When I searched for help I found a forum topic in which a user said most users of Stylish have moved to Stylus because of better user support and more continual updates. Stylus is a fork of Stylish. Stylus worked for me without the need to restart Firefox. Usage of the plug-in is simple - navigate to the page you want to style, click the app icon at top-right of your browser, choose whether you want to apply styles to the current URL only or whole domain and write your styles. When you visit again, the icon shows number of styles being applied by the plugin.

– youcantryreachingme
Oct 3 '18 at 23:14

|
show 2 more comments

I thought I'd got ChromEdit from the official list, but OK.

– OrangeDog
Jul 2 '15 at 19:57

9

Based on recent reviews, Stylish should probably be avoided.

– KlaymenDK
May 31 '17 at 8:59

1

An extension is not the same as an actual user stylesheet. That's why Chrome is worthless garbage now.

– Synetech
Jul 9 '17 at 23:02

1

@Synetech what are you talking about? This extension adds a button to open the stylesheet for editing.

– OrangeDog
Jul 9 '17 at 23:08

Stylish didn't work for me. When I searched for help I found a forum topic in which a user said most users of Stylish have moved to Stylus because of better user support and more continual updates. Stylus is a fork of Stylish. Stylus worked for me without the need to restart Firefox. Usage of the plug-in is simple - navigate to the page you want to style, click the app icon at top-right of your browser, choose whether you want to apply styles to the current URL only or whole domain and write your styles. When you visit again, the icon shows number of styles being applied by the plugin.

– youcantryreachingme
Oct 3 '18 at 23:14

I thought I'd got ChromEdit from the official list, but OK.

– OrangeDog
Jul 2 '15 at 19:57

Based on recent reviews, Stylish should probably be avoided.

– KlaymenDK
May 31 '17 at 8:59

An extension is not the same as an actual user stylesheet. That's why Chrome is worthless garbage now.

– Synetech
Jul 9 '17 at 23:02

@Synetech what are you talking about? This extension adds a button to open the stylesheet for editing.

– OrangeDog
Jul 9 '17 at 23:08

Stylish didn't work for me. When I searched for help I found a forum topic in which a user said most users of Stylish have moved to Stylus because of better user support and more continual updates. Stylus is a fork of Stylish. Stylus worked for me without the need to restart Firefox. Usage of the plug-in is simple - navigate to the page you want to style, click the app icon at top-right of your browser, choose whether you want to apply styles to the current URL only or whole domain and write your styles. When you visit again, the icon shows number of styles being applied by the plugin.

– youcantryreachingme
Oct 3 '18 at 23:14

|
show 2 more comments

protected by Community♦ Dec 23 '16 at 11:29

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Argthtjtr