title: CSS3: Show/Hide based on node contents
body: <blockquote>
    <p><strong>Possible Duplicate:</strong><br>
    <a href="https://stackoverflow.com/questions/1520429/css-3-content-selector">CSS 3 content selector?</a>  </p>
  </blockquote>
  
  
  
  <p>I couldn't find a way online to hide or show elements based on their contents in CSS. More specifically, in the following example, I'm searching for a CSS3 rule that would allow me to hide all <code>&lt;tr&gt;</code> entries whose second <code>&lt;td&gt;</code> child contains <code>File</code>.</p>
  
  <pre><code>&lt;tr&gt;
      &lt;td&gt;Succeded&lt;/td&gt;
      &lt;td&gt;File&lt;/td&gt;
      &lt;td&gt;Create&lt;/td&gt;
      &lt;td&gt;Left-&gt;Right&lt;/td&gt;
      &lt;td&gt;\Thunderbird\00sqrcu5.default.archive.7z&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
      &lt;td&gt;Succeded&lt;/td&gt;
      &lt;td&gt;Folder&lt;/td&gt;
      &lt;td&gt;Create&lt;/td&gt;
      &lt;td&gt;Left-&gt;Right&lt;/td&gt;
      &lt;td&gt;\Thunderbird\mab&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
      &lt;td&gt;Failed&lt;/td&gt;
      &lt;td&gt;File&lt;/td&gt;
      &lt;td&gt;Create&lt;/td&gt;
      &lt;td&gt;Left-&gt;Right&lt;/td&gt;
      &lt;td&gt;\Thunderbird\mab\abook.mab&lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>Is this even possible? I know that it would be better to add attributes to the <code>&lt;tr&gt;</code> elements, but I'm not sure if an attributes-based solution would support complex rules such as "second child is not 'Folder' and first is 'Failed'".</p>
  
  <p>Ideas?</p>