CSS Negate: Displaying specific elements in a hidden Element?

Question

Assume we have an element that is similar to this

<div id="navigation">
   <div class="nav-block-1">....</div>
   <div class="nav-block-2">....</div>
   This is the offer
   <a href="#"> Report </a>
</div>

Now I want to hide all the elements including the textelements but not the nav-block-2, so is there a way through which I can do this? Something like using CSS negation?

I tried using

#navigation :not(.nav-block-2) {
   display:none;
}

but this seems to negating even the elements inside nav-block-2? Am I doing something wrong here? Any ideas?

Answer 1

Maybe not what you want but here's what i'd do.

#navigation * {
    display:none;
}
#navigation a {
    display:inline;
}

EDIT: As it says in the comments in your question, I think it's difficult to do a :not when there's no tag around the text.