Display all tags with specific id with CSS and HTML

Question

How do I toggle all HTML tags specific ID using only HTML/CSS?

Example: HTML:

<html>...
<a href="#select">Select</a>
<img src="file.png" id="select">
<p id="select"> Paragraph </p>
...</html>

CSS:

#select {display: none;}
#select:target {display: block;}

I have tried using <div> however, when I do, only the some of the tags toggle.

Answer 1

you should use a class:

<html>...
<a href="#select">Select</a>
<img src="file.png" class="select">
<p class="select" id="select"> Paragraph </p>
.. <html>

and the CSS:

.select {display: none;}
.select:target {display: block;}

Answer 2

Because duplicate IDs are invalid HTML, you could use a class:

 .select { display: none; } .select:target { display: block; }

 <html> <a href="#select">Select</a> <img src="file.png" class="select"> <p id="select" class="select"> Paragraph </p> </html>