I have a “glossary” webpage with several items, each in a div with an ID and one of three classes (.a, .b and .c). So I have as many ID as are the items, and 3 classes for the whole page.
I’d like to give to my visitors the possibility to show only the items of one kind of class, hiding the items belonging to the other two classes.
So, in the normal view all items should be shown, but clicking a link, it should appear only one kind of items.
I have tried with css :target, but unsucessfully, because, I guess, :target works with IDs, but not with classes.
So I am afraid that javascript is the only possibility.
Thank you!
I have an old demo hat might be useful and just have updated it quickly to your use case. It may be a bit over-engineered but should fulfil the purpose.
Let me know if you need help understanding it. Basically it adds a class to the body and the css uses that class to hide and show things. The rest is just eye candy 
1 Like
You can make it work with :target like this and no js.
Obviously the JS allows for more fluid html and the styling of the active buttons as well when clicked which CSS alone can’t do.
1 Like
Of course it can
2 Likes
Thank you very much, Paul. This evening I am too tired. Tomorrow I will see, but basically I trust you
1 Like
Yes: it works perfectly! Wonderful! Excellent!
I prefer the :target solution, because of his simplicity: “the simpler, the better”.
Thank you very much!!! 
1 Like
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.