Using CSS properties in CSS selectors?

Using CSS properties in CSS selectors?

Context: I have three spans, A B C D (in that order). Based off of what is
put in a form next to these spans, I turn the visibility off or on of
these spans.
There's a line break in A and C that makes the display something like this :
A
B C
D
But if I hide C this ends up being :
A
B D
because the line break is not displayed.
What I'd like to do is add some other element (C') that would display if B
is displayed and C isn't. So that , if C isn't there, I can still get the
line break:
A
B (C')
D
I'm pretty sure this is possible by using a combination of class-based CSS
switching and the :after pseudo-selector, but I'd rather like to avoid
having to go in and modify the Javascript to change from the current
display:show/none mechanisms. So my question ends up being :
Is it possible to 'inspect' currently set styles (such as 'display') in
CSS rules ? I'd like to be able to do something similar to the attribute
mechanism where I can do :
A[display='show']~B[display='none']:after {
content : '\a';
}
But just looking at the selectors I don't see how I could accomplish this
without declaring new classes.