CSS and XML Codes Won't Work with New Browser/PC

[Wiggam72]

I have a new PC. I'm going through the painstaking task of installing programs. I imported my bookmarks and transferred them via external hard drive, and I then copied and pasted my .css chrome folder into the FF Profile folder via external hard drive.

None of my .css codes work. Is this commonplace? I even made new folders and a new .css file (and pasted the code into it) and did the same with the bindings.xml file. I did notice some of the text is red. What can I do to make them work?

[costark]

I presume it's because of this ...............To improve performance, Firefox 69 and later will disable loading of userChrome.css and userContent.css by default.

Your CSS customizations are not going away; all you will need to do is set the pref (in about:config) --- toolkit.legacyUserProfileCustomizations.stylesheets --- to TRUE.

IF FF 71 Clk -- SHOW ALL -- when about:config first appears, THEN Paste and Clk arrows far Rt to net True.

[morat]

The -moz-binding property fails in Firefox 72 since the developers removed the XBL implementation.

[Wiggam72]

I presume it's because of this ...............To improve performance, Firefox 69 and later will disable loading of userChrome.css and userContent.css by default.

Your CSS customizations are not going away; all you will need to do is set the pref (in about:config) --- toolkit.legacyUserProfileCustomizations.stylesheets --- to TRUE.

IF FF 71 Clk -- SHOW ALL -- when about:config first appears, THEN Paste and Clk arrows far Rt to net True.

Thanks costark, the .css worked. Unfortunately the bindings.xml file still doesn't work. In fact, it won't allow the text. I tried changing things to True that I found doing a search in about:config with the query bindings, and xml.

The -moz-binding property fails in Firefox 72 since the developers removed the XBL implementation.

Both PC's have the recent update version 71. Did you think it's removed in version 71? Also, does that mean that we won't be able to use .css anymore if you update to version 72? Should I disable the auto update feature?

[jscher2000]

The -moz-binding property fails in Firefox 72 since the developers removed the XBL implementation.

Both PC's have the recent update version 71. Did you think it's removed in version 71? Also, does that mean that we won't be able to use .css anymore if you update to version 72? Should I disable the auto update feature?

CSS -- style rules -- should work. What apparently won't work any more is backdooring JavaScript into the browser UI via CSS (sometimes referred to as userChrome.js). You'll need to use a different method such as an Autoconfig file, if the particular code is supported through that mechanism.

If your sanity depends on the JavaScript injection, consider ESR as a temporary respite:

https://support.mozilla.org/kb/switch-t ... elease-esr

[morat]

I got my userChrome.js hacks working in Firefox 71, but not in Firefox 72.

More info: http://forums.mozillazine.org/viewtopic ... &t=3056596

If you are using Firefox 71, then post the userChrome.css and bindings.xml hacks using the BBCode [code]...[/code] tags.

[Wiggam72]

This is the bindings.xml code.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE bindings>
<bindings xmlns="http://www.mozilla.org/xbl">
<binding id="tabs-scroll" extends="chrome://global/content/bindings/scrollbox.xml#arrowscrollbox">
<handlers>
<handler event="wheel"><![CDATA[
// Preserve original behaviour if meta (Windows) key is held
if (event.metaKey) return;

if (event.deltaY < 0) {
gBrowser.tabContainer.advanceSelectedTab(-1, true);
}
else {
gBrowser.tabContainer.advanceSelectedTab(1, true);
}
event.stopPropagation();
event.preventDefault();
]]></handler>
</handlers>
</binding>
</bindings>

[morat]

Did you try Gusar's solution?

More info
http://forums.mozillazine.org/viewtopic ... #p14827747
http://www.reddit.com/r/firefox/comments/afh6th

BBCode guide
http://forums.mozillazine.org/faq.php?mode=bbcode

[Wiggam72]

It didn't work. I'm wondering if the problem is that the new PC says it's an XML document and not a file as opposed to the original PC that shows it as a file. If I open it, it's blank!

However, the copy I made that's on the external drive also says it's a document, but I can see the text.

[morat]

I think the css selector is obsolete in the reddit thread.

Firefox 70: .tabbrowser-arrowscrollbox > .arrowscrollbox-scrollbox
Firefox 71: .tabbrowser-arrowscrollbox::part(scrollbox)

Reference
http://searchfox.org/mozilla-esr68/sear ... t+tabstrip
http://searchfox.org/mozilla-release/se ... t+tabstrip
http://searchfox.org/mozilla-release/so ... ersion.txt

You can use the toolkit.tabbox.switchByScrolling pref in Firefox 71.

Try setting the toolkit.tabbox.switchByScrolling pref to true, then restart, then mouse scroll on the "Open a new tab" button to switch tabs.

[Mudder]

I presume it's because of this ...............To improve performance, Firefox 69 and later will disable loading of userChrome.css and userContent.css by default.

Your CSS customizations are not going away; all you will need to do is set the pref (in about:config) --- toolkit.legacyUserProfileCustomizations.stylesheets --- to TRUE.

IF FF 71 Clk -- SHOW ALL -- when about:config first appears, THEN Paste and Clk arrows far Rt to net True.

Well, just updated to 71 portable today, everything is same, stylesheets was already set on TRUE but now my tabs are no longer below the nav/address bar, but above it where I don't want. Below nav/address bar is blank.
Am I going to have to re-learn everything from two years ago?
I want my tabs back on the bottom where they belong.
I was a sick old man two years ago, and its only gotten worse, I wasn't prepared for this.
If I wanted bloody Chrome or Opera I'd use them, I just think the security with FF is better.

[Wiggam72]

I think the css selector is obsolete in the reddit thread.

Firefox 70: .tabbrowser-arrowscrollbox > .arrowscrollbox-scrollbox
Firefox 71: .tabbrowser-arrowscrollbox::part(scrollbox)

Reference
http://searchfox.org/mozilla-esr68/sear ... t+tabstrip
http://searchfox.org/mozilla-release/se ... t+tabstrip
http://searchfox.org/mozilla-release/so ... ersion.txt

You can use the toolkit.tabbox.switchByScrolling pref in Firefox 71.

Try setting the toolkit.tabbox.switchByScrolling pref to true, then restart, then mouse scroll on the "Open a new tab" button to switch tabs.

Sorry, had to leave. I'm back. Thanks! I finally got it to work. For some unknown reason, even after deleting the .xml file and making a new text file, it wouldn't let me paste anything from the .xml code that was copied from what I have saved on the external hard drive attached to the new PC. I finally got the bright idea to copy the code I pasted here and try it, and it worked! I guess that means there was some sort of corruption during the transfer/copy of that file to the external hard drive. The .css one doesn't have a problem. Weird.

Even though it now works, it's not as good as how it was before since it doesn't wrap around and the cursor has to be placed on the "Open a new tab" button to switch tabs. Well, it's better than nothing.

[morat]

I got the tweak working with the "Open a new tab" button. It wraps around correctly.

The tweak stops working when the tab overflow scroll arrow buttons appear.

The tweak starts working again when the buttons disappear after closing a few tabs.

* chrome\userChrome.css

Code: Select all

/* Firefox userChrome.css */

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

toolbarbutton#tabs-newtab-button {
  -moz-binding: url("bindings.xml#tabs-scroll") !important;
}

* chrome\bindings.xml

Code: Select all

<?xml version="1.0"?>
<bindings xmlns="http://www.mozilla.org/xbl">
  <binding id="tabs-scroll">
    <handlers>
      <handler event="wheel"><![CDATA[
        if (event.metaKey) return;
        if (event.deltaY < 0) {
          gBrowser.tabContainer.advanceSelectedTab(-1, true);
        }
        else {
          gBrowser.tabContainer.advanceSelectedTab(1, true);
        }
        event.stopPropagation();
        event.preventDefault();
      ]]></handler>
    </handlers>
  </binding>
</bindings>

Remember to set the toolkit.tabbox.switchByScrolling pref to false, then restart.

Firefox 71.0
Windows 7 SP1 32-bit

P.S.

I don't understand why I get a syntax error '.tabbrowser-arrowscrollbox::part(scrollbox)' is not a valid selector if I try using the selector in the console.

Code: Select all

document.querySelector(".tabbrowser-arrowscrollbox::part(scrollbox)");

[Wiggam72]

Couldn't get it to work. I guess I put the userChrome.css code in the wrong place. Unlike the bindings.xml which only has the one code to overwrite, it has several codes in the file. So, I may have deleted the wrong code before replacing it with the one you posted.

[morat]

I figured out why the '.tabbrowser-arrowscrollbox::part(scrollbox)' selector doesn't work in userChrome.css file.

More info: http://forums.mozillazine.org/viewtopic ... #p14851430

P.S.

I can return the scrollbox element in the console like so.

Code: Select all

document.querySelector(".tabbrowser-arrowscrollbox").shadowRoot.querySelector("scrollbox");