How to remove drop down menu indicator on a button in a XUL Firefox extension?

Question

I'm working on a Firefox extension that creates a toolbar in the browser. I'm using a with type="menu" to create a menu that pops up when the button is clicked.

By default, setting type="menu" creates a little menu indicator triangle, like in this image:

Is there any way, either in XUL or in the CSS, to get rid of this indicator triangle?

Answer 1

You could try with another approach. Insert a regular button and use the popup property to make a menupopup appear when clicking on it.

<popupset>
    <menupopup position="after_start" id="testPopup">
        <menuitem label="test"/>
    </menupopup>
</popupset>
<button label="test" type="menu" popup="testPopup"/>

You can play around with the position property to get the desired result