title: CSS to target li inside ul inside li
body: <p>I've looked through several DBs but I haven't found the answer that matches or works for my scenarios, so I'm turning to the experts, or at least the more experienced. I'm fairly new to HTML and CSS. I'm trying to figure out how to target an li inside of a ul, that's inside of an li, under a ul. Sort of like a drop down menu, where the main header has a submenu with more options. I don't want to add more classes or id's. I've tried the following versions to apply some basic CSS to it, but I can't seem to get it to target it:</p>
  
  <pre><code>    #header-nav ul li
      li ul li a
      li#header-nav ul li
  </code></pre>
  
  <p>Even descendants doesn't seem to work (or it may be that I'm not doing it correctly?)</p>
  
  <p>HTML:</p>
  
  <pre><code> &lt;ul id="header-nav"&gt;
      &lt;li&gt;
        &lt;a href="#"&gt; Home &lt;/a&gt;
      &lt;/li&gt;
      &lt;li&gt;
        &lt;a href="#"&gt;Test Submenu &lt;/a&gt;
        &lt;ul&gt;
          &lt;li&gt; &gt; &lt;a href="#"&gt; Test 1 &lt;/a&gt; &lt;/li&gt;
          &lt;li&gt; &gt; &lt;a href="#"&gt; Test 2 &lt;/a&gt; &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/li&gt;
   &lt;/ul&gt;
  </code></pre>
  
  <p>I am attempting to target the Test 1 and Test 2 lines. Is there a way I can do this? I'm tapped on formats to make it work. I just want to change the font size of those two lines. I know it would be easier to add the classes or IDs but I am trying to avoid them where possible as I'm trying to understand the whole child, descendants, targeting thing better.</p>