Created attachment 339625 [details]
test case

I'm trying to apply some simple CSS styling to my application. The crux is that I want any GtkFrame to get a slightly darker background than its parent widget - which might be another Frame.

FWIW: I only actually nest Frames at 2 levels. Using Frames is justified as I must group large numbers of widgets. I want to visually differentiate Frames so that users can immediately see the sections/boundaries in the UI. Border lines alone aren't as clear as I'd like for this purpose.

So, I'm trying to do this by applying 'shading' to each Frame, through applying a black background-colour with transparency. So, I load a CSS provider including this selector:
    frame > border { background-color: rgba(0, 0, 0, N); }

where N is the desired level of alpha/amount of shading, of course < 1.0.

First: Is this pattern supposed to work? I hope so. And it certainly looks like GTK+ _tries_ to do it - by giving the Frames' backgrounds the successively darker colours I want - but then it fails. Descendant widgets, with transparent backgrounds, don't reliably get the correct background colour for their 'level' (parent Frame). Sometimes they get the colour of the uppermost window or Frame. Actions like hovering over the child or resizing the window can temporarily apply the background colour they should have, but it seems completely intermittent and arbitrary, and doing something else will glitch them out again.

The end result is that the background-colour property is unusable with transparency in nested GtkFrames. The alternative of faking an equivalent semi-transparent background using box-shadow with a huge spread and inset seems to be broken in the same way.

Please see the attached, contrived test case. Try mousing over the widgets and resizing the window. It's likely other widgets are affected, but the Scale and CheckButton shown in this example are the ones I noticed first off. Let me know if I can provide anything else to help.