I went into the Browser Toolbox (Source Docs page) and added this to my existing userChrome.css code (listed in the Style Editor tab) and it switches the positions between the content and the find bar, once I switch from the Style Editor over to the Inspector tab:

/* Move Find bar above content */
.browserContainer > findbar {
    -moz-box-ordinal-group: 0; 
    position: fixed !important; 
    /* Clean up the top and bottom borders */
    border-bottom: 1px solid ThreeDShadow !important;
    border-top: none !important;
}

That isn't floating, though -- it is fixed. What do you mean by floating?

Thank you for your reply. I apologize for the term "floating". I really meant "move to the top of the page". I 've used it for years in the same place in Firefox and probably compared it to other software where I can move it around the page. I compared your .css instructions to mine and they're the same. I even copied yours into my .css file for testing and still don't get the search box. I have disabled all my add-ons and left in the .css file and still no search box. I've tested this in Windows 11 and still no search box. If I remark out the .css instructions, the box will show OK at the botton of the screen. Works fine in Version 106. Thanks for your help. Regards

If I remark out the .css instructions, the box will show OK at the bottom of the screen.

Okay, so Firefox is reading the rule and moving the box, but I guess for some reason it's not expanding when you hit Ctrl+F. I tested on a clean profile with no other userChrome.css rules and it was working fine, so I wonder whether there might be a conflict with another rule in your file?

Nope, that's not it. I remarked out all other userChrome.css instructions and still don't see the box anywhere. I've got a kazillion Firefox changes made through about:config over the years. I have them all documented so I guess I'll have to go through them and maybe find the culprit. I'll live with the box on the bottom for now. Thanks again. Regards

You can try to add a z-index:2147483647 !important; rule.

Nope, z-index:2147483647 !important; doesn't work. Thanks anyway.

Firefox 113 broke my Findbar position. I've had it at the top for years but it jumped to the bottom when I updated from 112 to 113 on May 9, 2023. Has anyone found a solution?

Firefox 113 broke my Findbar position. I've had it at the top for years but it jumped to the bottom when I updated from 112 to 113 on May 9, 2023. Has anyone found a solution?

Firefox 113 removed some properties that start with -moz-box, including "-moz-box-ordinal-group". There is a new way to set the order of elements, but I haven't researched it. You might find a thread about it on r/FirefoxCSS.

https://www.reddit.com/r/FirefoxCSS/

What is your current code to place the findbar at the top position? Like posted above, you need to replace -moz-box-ordinal-group with order and decrement its value by one (you will probably need to set it to -1).

.browserContainer > findbar {order:-1; border-top: none !important; border-bottom: 1px solid ThreeDShadow !important;}

Thanks jscher2000, I found a thread at r/FirefoxCSS that explains the changes to -moz-box https://www.reddit.com/r/FirefoxCSS/comments/11odffm/psa_incoming_changes_to_default_element/

And thanks cor-el, That's the exact code I'm now using to move the Find Bar to the top.

Regards, David.

This is the thread on Reddit.

https://www.reddit. com/r/FirefoxCSS/comments/11odffm/psa_incoming_changes_to_default_element/

Thanks for all your help, but nothing is working. This is what I'm using in my userChrome.css ... .browserContainer > findbar {-moz-box-ordinal-group:0; position: fixed !important; }

I'm looking for an accurate definite answer to my problem. Does anyone have one?

Regards

Did you try the code I posted above as you need to replace -moz-box-ordinal-group (default is '1') by order (default is '0') as this is a flex item?

• https://developer.mozilla.org/en-US/docs/Web/CSS/order

.browserContainer > findbar {
  order:-1;
  border-top: none !important;
  border-bottom: 1px solid ThreeDShadow !important;
}

Thanks cor-el

I just tried it and the findbar is still at the bottom. I also went to the https address you showed and, sorry, I have no idea what all of it means,

Regards

Do you have other code for the findbar element that might cause issues ?

Try a userChrome.css with only this code and possibly add !important.

.browserContainer > findbar {
  order: -1 !important;
  border-top: none !important;
  border-bottom: 1px solid ThreeDShadow !important;
}

You can use the Browser Toolbox to inspect the findbar code.

• https://firefox-source-docs.mozilla.org/devtools-user/browser_toolbox/

Hi cor-el

No, there's no other code that should affect it. Here's all the code in my userChrome.css ...

/* do not remove the following line, it's needed for the css code to run properly */
/* @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); */
/* removed the above line on Jan 8/2020 to fix Version 72.0.0 problem with current tab display */
/* it looks like the @namespace line is no longer needed in any Firefox userchrome.css files */

/* -------------------------------------------------------------------------------------------------- */
/* move Find Bar to top */

.browserContainer > findbar {-moz-box-ordinal-group:0; position: fixed !important; }

* -------------------------------------------------------------------------------------------------- */
/* remove Zoom Reset button from URL address bar */
#urlbar-zoom-button { display:none!important }
/* -------------------------------------------------------------------------------------------------- */
/* remove Page Action button from URL address bar */
image#pageActionButton { display:none !important; }
image.urlbar-page-action { display:none !important; }
/* -------------------------------------------------------------------------------------------------- */ 
/* Hide star button (bookmark) */
#star-button { display:none; }
/* -------------------------------------------------------------------------------------------------- */ 
/* Remove Extensions Button from Toolbar */
#unified-extensions-button, #unified-extensions-button > .toolbarbutton-icon{
width: 0px !important;
padding: 0px !important; }
/* -------------------------------------------------------------------------------------------------- */ 

Regards

I still see the old code with -moz-box-ordinal-group in your above posted code, so if you made the changes I suggested above then your edit failed or you edited the userChrome.css in another profile. This code no longer works:

.browserContainer > findbar {-moz-box-ordinal-group:0; position: fixed !important; }

Hi cor-el

I showed you the old code along with all my other code because it worked all in 106 and before. I took the old code out and added your changes and it din't work. I only have one profile.

Regards

I haven't tried your code, but on closer inspection it looks you accidentally removed the '/' that starts the comment that follows your findbar code.

/* -------------------------------------------------------------------------------------------------- */
/* move Find Bar to top */

.browserContainer > findbar {-moz-box-ordinal-group:0; position: fixed !important; }

* -------------------------------------------------------------------------------------------------- */

Corrected code:

/* -------------------------------------------------------------------------------------------------- */
/* move Find Bar to top */

.browserContainer > findbar {-moz-box-ordinal-group:0; position: fixed !important; }

/* -------------------------------------------------------------------------------------------------- */

Hi cor-el

You're right. I think I screwed it up when I was copying to my reply.

I've gone back and completely removed my code and inserted yours. I triple checked things and it still doesn't work. Sorry for the inconvenience.

I can't figure out why this is so hard to fix. Remember, this did work in 106. I can't be the only one who's moved the findbar to the top in Firefox.

Regards