Question

Is it possible to do it just with CSS? Every new :target seems to change the URI (.html#my target name comes here) and naturally that messes / resets the other previous behavior.

If only there would be a way to assign other :target to be “silent” or “invisible”, so that it doesn’t affect the URI and both :targets could function on their separate rights. Or would this defeat the whole purpose of this selector?

Answer 1

In a conforming HTML page, there can only ever be one :target element at a time.

The moment you navigate to another target, the hash fragment in the URI changes, making the previous one history (no pun intended) and no longer relevant to the URI. In the same way, :target will no longer apply to whichever element previously was the target element.

So, indeed, the behavior you’re trying to achieve would defeat the purpose of the :target selector for HTML documents. There is currently no way to continue applying styles to it based on such behavior using only CSS.