On Aug 14th 11 PM ET/Aug 15th 03:00 UTC, due to scheduled Firefox Account server maintenance, users may not be able to sign in or create a new subscription. This is expected to last approximately 30 minutes. Status updates can be found at https://status.vpn.mozilla.org or https://status.relay.firefox.com.

搜尋 Mozilla 技術支援網站

防止技術支援詐騙。我們絕對不會要求您撥打電話或發送簡訊,或是提供個人資訊。請用「回報濫用」功能回報可疑的行為。

Learn More

Firefox 93.0 -- how do I get rid of black border on focused searchbar?

more options

Firefox just updated itself to 93.0 and now suddenly I have a big black border around the searchbar when it is focused. The userchrome "#searchbar { border: none !important; }" gets rid of the white border when the searchbar is not focused, but (just a stab in the dark) the userchrome "#searchbar[focused="true"] { border: none !important; }" does nothing when it is focused. How can I get rid of it? (It can be seen in the right-hand part of the attached image.)

Firefox just updated itself to 93.0 and now suddenly I have a big black border around the searchbar when it is focused. The userchrome "#searchbar { border: none !important; }" gets rid of the white border when the searchbar is not focused, but (just a stab in the dark) the userchrome "#searchbar[focused="true"] { border: none !important; }" does nothing when it is focused. How can I get rid of it? (It can be seen in the right-hand part of the attached image.)
附加的畫面擷圖

被選擇的解決方法

Got it. Finally found a spot poking with the inspector. The following does the job:

  1. urlbar[focused="true"]:not([suppress-focus-border]) > #urlbar-background, #searchbar:focus-within { outline:none !important; }

No idea why this has suddenly appeared and suddenly become so complex.

Thanks for your help.

(Cannot find any button on this Firefox support page, the one with your answer to which I am responding, that will give me monospace font text like your example.)

從原來的回覆中察看解決方案 👍 0

所有回覆 (6)

more options

I wonder whether the black color is part of your theme? My search box and address bar still have the same "blue glow" outline they had in Firefox 92. I think those might be a box-shadow, rather than a border, but I haven't poked around in the Browser Toolbox to find out. (MDN: https://developer.mozilla.org/docs/Tools/Browser_Toolbox)

more options

I've been poking around the toolbox with no success as yet -- poked around a bunch before posting. It is a nice tool, but I cannot find what is setting that color. Am using the system theme with some userchrome overrides mainly from Classic Theme Restorer. WIll poke some more, now.

由 OneMoreName 於 修改

more options

This is giving me the blue glow in Firefox 93:

#urlbar[focused="true"] > #urlbar-background, 
#searchbar:focus-within {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.23);
}

Do you have rules for :focus-within ? https://developer.mozilla.org/docs/Web/CSS/:focus-within

Note: to find rules for focus and hover states, in the Browser Toolbox inspector, near the top of the rules panel, click :hov to open a row of checkboxes.

more options

選擇的解決方法

Got it. Finally found a spot poking with the inspector. The following does the job:

  1. urlbar[focused="true"]:not([suppress-focus-border]) > #urlbar-background, #searchbar:focus-within { outline:none !important; }

No idea why this has suddenly appeared and suddenly become so complex.

Thanks for your help.

(Cannot find any button on this Firefox support page, the one with your answer to which I am responding, that will give me monospace font text like your example.)

more options

OneMoreName said

(Cannot find any button on this Firefox support page, the one with your answer to which I am responding, that will give me monospace font text like your example.)

There are two ways:

(1) Type at least one space at the beginning of each line of code

(2) Use the HTML preformatting tags (quote my reply to see how)

more options

This thread looks related, if you end up needing another property to manipulate in the future: https://www.reddit.com/r/FirefoxCSS/comments/q223dy/firefox_93_urlbar_and_serach_border_width_code/