Custom css does not allow "has" selector (with sub selectors)
Dear community,
in a redesign of my Master Mashup I have a menu bar (showing icons) on the left hand side. On hover the bar is extending in its width, revealing the menu item labels. This is handled in css and works well. With one exception: On click a submenu shows up. When hovering the sub menu the menu bar is shrinking back to the original size and the sub menu is lost in the middle of the mashup. I would like to keep the menu bar expanded as long as a sub menu is open.
For this purpose I have checked the DOM tree and have noticed the sub menu (a "ul" element with classes "menu-level1" and "widget-menu-submenu") is attached to the body element. My research on the web led me to the "has" selector, resulting in this css code:
body:has(>ul.menu-level1) .container-menuandlogo {
max-width: 210px !important;
width: 210px !important;
}
I am setting width and max-width if the body has a "ul" element with class "menu-level1". Experts will already notice I am not a web designer, I am just trying to make something work.
But unfortunately it doesn't work. Thingworx won't let me save the mashup due to invalid css. It does not accept the ">" nor the "." character. With my little knowledge (confirmed by tests) I would say this is valid css.

Being the smartass I am I have exported the mashup to xml, changed the css to the code above and imported back to Thingworx. I opened up the Mashup and it worked as intended, the menu remains expanded as long as the sub menu is open. Hoo....ray? But what is this? When using the menu and navigating to another mashup the styles get broken. Unrelated labels have a different styling now, the label styles are not defined in Custom css but by the style properties.
Okay, next try. If the characters ">" and "." are the problem I might be able to escape them. After some more research I came up with:
body:has(\3Eul\2Emenu-level1) .container-menuandlogo {
max-width: 210px !important;
width: 210px !important;
}
Same code, only the two characters escaped. Yeaah, Thingworx is accepting that....but it does not work, it has simply no effect on the mashup.
So, at this point I am giving up and my questions are:
- a) What am I doing wrong?
b) Is this a bug of Thingworx?
c) What can I do to make it work? - Maybe you know a better way to achieve what I want?
Thank you
Benny

