Windows 10 will reach EOS (end of support) on October 14, 2025. For more information, see this article.

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

CSS: control an icon added to context-menu by an extension

  • 2 replies
  • 1 has this problem
  • 21 views
  • Last reply by Yaron

more options

toolbarbutton[id*="8883111b-4bc8-4a99-b37f-5672f6cf9834"]

Controls an icon added to the toolbar.

What's the syntax for controlling an icon added to the context-menu by an extension?

Example: https://addons.mozilla.org/en-US/firefox/addon/simple-search-google-for/

(It does not have an ID in manifest.json but *I can add it*).

Thank you.

toolbarbutton[id*="8883111b-4bc8-4a99-b37f-5672f6cf9834"] Controls an icon added to the toolbar. What's the syntax for controlling an icon added to the context-menu by an extension? Example: https://addons.mozilla.org/en-US/firefox/addon/simple-search-google-for/ (It does not have an ID in manifest.json but *I can add it*). Thank you.

Chosen solution

cor-el,

Thank you so much. I appreciate it.

Your reply led me in the right direction.

menuitem[id*="MorfixSearch"] { -moz-box-ordinal-group: 100 !important; margin-bottom: 4px !important; }

(id*="MorfixSearch" set in background.js).

Read this answer in context 👍 0

All Replies (2)

more options

Extension that do not have an ID seem to get a random ID (<id>.xpi in profile), so you can't use that ID as a CSS selector and the UUID (about:debugging) is also random.

You can try to use a selector like this:

  • menuitem[label^="Search Google for"][image^="moz-extension://"] .menu-iconic-icon {}

more options

Chosen Solution

cor-el,

Thank you so much. I appreciate it.

Your reply led me in the right direction.

menuitem[id*="MorfixSearch"] { -moz-box-ordinal-group: 100 !important; margin-bottom: 4px !important; }

(id*="MorfixSearch" set in background.js).

Modified by Yaron