Hi Mo,
This is a expected css behavior.
To realize the effect, we can use the "background: rgba(0, 0, 0,0.5);" instead of "opacity: 0.4;". The 4th number in the parenthesescontrols the opacity. By this way, the child elements won't be affected thus you can keep the structure.
Best regards,
Alfred