Q:

CSS target selector

Is there a way to display p tag "This is my answer" when you click on anchor tag "Click me" with just CSS? I know I can put p tag after anchor tag and make it work but I was wondering if there is a way to make it work with the code below?
  <ul>
     <li>
        <div>
           <a href="one" id="one"> Click me </a>
        </div>
     </li>
        <div class="info">
           <p> This is my answer </p>
        </div>
   </ul>

li {
    list-style: none;
}

.info {
    display:none;
  }

.info:target {
    display:block;
}

https://jsfiddle.net/vwep64bd/2/

A:

Here's a CSS-only documented hack to control elements with a hidden checkbox. This definitely seems to cross the boundaries of "should", but sure, it's possible.
For more reading: https://css-tricks.com/the-checkbox-hack/

 li {
  list-style: none;
 }

 label.link {
  color: blue;
  text-decoration: underline;
  cursor: pointer;
 }

 div.info {
  display: none;
 }

 #toggle-1 {
  display: none;
 }

 #toggle-1:checked ~ div {
  display: block;
 }
<ul>
    <li>
        <div>
            <label class="link" for="toggle-1">Click Me</label>
        </div>
    </li>
    <input type="checkbox" id="toggle-1">
    <div class="info">
        <p>
            This is my answer
        </p>
    </div>
</ul>

