How to change right-arrow image in Qt's QMenu for selected items with a CSS stylesheet?

Question

I have a Qt QMenu in my app, consisting of two levels (the top level of submenus, then each submenu containing actions), and we have a custom dark-grey style whereby the menu background is grey, the text color is white, and the right arrow is white. When a submenu item is highlighted (mouse-over), the item background is white, the text is black, and I want the right arrow to switch to a black image as well. I'm using a CSS stylesheet to do this. However, I can't seem to find the right syntax to set an alternate right-arrow image for the item selected state. My CSS looks like this:

QMenu
{
  background-color: rgb( 24, 24, 24 );
  color: white;
}

QMenu::item:selected
{
  background-color: white;
  color: black;
}

QMenu::right-arrow
{
  image: url(Resources/MenuRight.png);
}

I've tried the following additions after the above code (where MenuRightSelected.png is an inverted-color image of MenuRight.png):

QMenu::right-arrow:selected
{
  image: url(Resources/MenuRightSelected.png);
}

and

QMenu::item::right-arrow:selected
{
  image: url(Resources/MenuRightSelected.png);
}

Neither of these affect the displayed QMenu. Does anyone know if it is possible to do what I'm after, and if so, how?

Answer 1

Possibly you only have to change the order of the items in your css file. I once heard that Qt parses the css files from upwards. Items further up overwrite the behaviour of items further down.