title: Css correct selector
body: <p>I have the follownig code:</p>
  
  <pre><code>&lt;ul class="menu"&gt;
  &lt;li class="leaf"&gt;&lt;a href="#"&gt;First&lt;/a&gt;&lt;/li&gt;
  &lt;li class="leaf"&gt;&lt;a href="#"&gt;Second&lt;/a&gt;&lt;/li&gt;
  &lt;li class="leaf"&gt;&lt;a href="#"&gt;Third&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>and the css</p>
  
  <pre><code>.menu li:hover &gt; a, .menu li.active &gt; a{
  color: white;
  text-decoration: underline;
  font-weight: bold;
  }
  </code></pre>
  
  <p>When i hover the item the color change. But when i select the item, the css code doesn't work. I want when i select a link and go to other page, the link displayed in white. What's the selector? I thought it was <strong>li.active > a</strong>, but this doesn't work.</p>