title: CSS: Show span inside <td>, on row hover
body: <p>I need to show a span inside a <code>&lt;td&gt;</code>, but only when the cointaner <code>&lt;tr&gt;</code> is hovered.</p>
  
  <p>I have wrote this css rules, but they don't seem to work:</p>
  
  <pre><code>.table-hover &gt; tbody &gt; tr:hover &gt; span.showOnHover {
      display:block!important;
  }
  
  .table-hover &gt; tbody &gt; tr &gt; span.showOnHover {
      display: none !important;
  }
  </code></pre>
  
  <p>Take a look to: <a href="https://jsfiddle.net/59ovvrvm/1/" rel="nofollow noreferrer">https://jsfiddle.net/59ovvrvm/1/</a></p>
  
  <p>I know I can do this with jquery, but any alternatives to do it only with css?</p>