Mozilla VPN is currently experiencing an outage. Our team is actively working to resolve the issue. Please check the status page for real-time updates. Thank you for your patience.

This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Puzzle Piece Icon is Missing

  • 7
  • 1 nwere nsogbu anwere nsogbu a
  • 1 view
  • Nzaghachi ikpeazụ nke br5491

more options

The puzzle piece icon is not on the toolbar. Neither is it shown in the customize toolbar dialog. I have reset the toolbar to default, rebooted Windows 11 and removed & reinstalled Firefox 120.0.1 (64 bit). Those did not work. How can I restore the puzzle piece icon to the toolbar?

The puzzle piece icon is not on the toolbar. Neither is it shown in the customize toolbar dialog. I have reset the toolbar to default, rebooted Windows 11 and removed & reinstalled Firefox 120.0.1 (64 bit). Those did not work. How can I restore the puzzle piece icon to the toolbar?
Nseta ihuenyo ndị agbakwunyere

Asịsa ahọpụtara

That is about the part at the start that sets the width of this icon to 0px.

#unified-extensions-button, #unified-extensions-button > .toolbarbutton-icon{
width: 0px !important;
padding: 0px !important;
}
Gụọ azịza a na nghọta 👍 0

All Replies (7)

more options
more options

You appear to be using userChrome.css, so make sure that you aren't blocking this icon and others.

legacyUserStylesheets.active: TRUE
legacyUserStylesheets.types: userChrome.css,userContent.css

Start Firefox in Troubleshoot Mode to check if one of the extensions ("3-bar" menu button or Tools -> Add-ons -> Extensions) or if hardware acceleration or if userChrome.css/userContent.css is causing the problem.

  • switch to the Default System theme: "3-bar" menu button or Tools -> Add-ons -> Themes
  • do NOT click the "Refresh Firefox" button on the Troubleshoot Mode start window
more options

I finally found the specific cause of the problem in userChrome.css. Thanks cor-el for pointing me in the right direction.


userChrome.css

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

  1. unified-extensions-button, #unified-extensions-button > .toolbarbutton-icon{

width: 0px !important; padding: 0px !important; }

  1. tabbrowser-tabs ~ #alltabs-button {display:none!important;}
	/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/multi-row_bookmarks.css made available under Mozilla Public License v. 2.0

See the above repository for updates as well as full license text. */

/* Makes bookmarks toolbar span multiple rows */

  1. PersonalToolbar{
 --multirow-bmb-n-rows: 4; /* Control how many rows are shown before scrolling */
 --multirow-bmb-row-margin: 2px; /* Control how much spacing is between rows */
 max-height: none !important;

}

  1. PlacesToolbar > hbox{
 display: block;

/* width: 100vw; This is causing the problem*/

 width: 200vw;  /* This fixed the problem */

}

  1. PlacesToolbarItems{
 display: flex;
 flex-wrap: wrap;
 /* --uc-bm-padding is defined in autohide_bookmarks_toolbar.css */
 max-height: calc(var(--multirow-bmb-n-rows) * (5px + 1em + (2 * (var(--multirow-bmb-row-margin) + var(--uc-bm-padding,4px))))) !important;
 overflow-y:auto;
 scrollbar-color: var(--lwt-accent-color) var(--toolbar-bgcolor) ;
 scrollbar-width: thin;

}

/* Hide the all-bookmarks button */

  1. PlacesChevron{ display: none }

/* Add some spacing between rows */

  1. PlacesToolbarItems > .bookmark-item{ margin: var(--multirow-bmb-row-margin) 2px !important; }

Edeziri site na br5491

more options

Asịsa Ahọpụtara

That is about the part at the start that sets the width of this icon to 0px.

#unified-extensions-button, #unified-extensions-button > .toolbarbutton-icon{
width: 0px !important;
padding: 0px !important;
}
more options

I posted a lengthy response with userChrome.css, but for some reason it is not showing. The line in the userChrome.css file that fixed the problem was changing the #PlacesToolbar width from 100 to 200.

#PlacesToolbar > hbox{ 
 display: block;
 width: 200vw;

Thank cor-el for solving this problem!

Edeziri site na br5491

more options
more options

The latest code worked without any changes. Thanks!