title: Showing/hiding elements inside a div block with HTML and CSS
body: <p>I would like to show/hide elements inside a div block. A similar <a href="https://stackoverflow.com/questions/19170781/show-hide-divs-on-click-in-html-and-css-without-jquery">post</a> showed me how, but I can't make the links inside the div block work properly.</p>
  
  <p>The div block:</p>
  
  <pre><code>&lt;div   class="collapse"  tabindex="1"&gt;
  &lt;h1&gt; Test &lt;/h1&gt;
  &lt;p&gt;&lt;a href="www.google.com"&gt;link&lt;/a&gt;&lt;/p&gt;
  &lt;p&gt;some other text&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The CSS part:</p>
  
  <pre><code>.collapse &gt; * + *{
  display:none;
  }
  .collapse:focus &gt; * + *{
  display:block; 
  }
  </code></pre>
  
  <p>Here is a <a href="http://jsfiddle.net/fKNTv/1/" rel="nofollow noreferrer">JSFiddle</a> of my script.</p>
  
  <p>Basically, as I click on the link, the div block collapse.
  Do you know how can I fix this? Thanks!!</p>