title: How do I change the color or text in an anchor tag by targeting the class within the anchor tag?
body: <p>can some one explain why the following happens:</p>
  
  <pre><code>&lt;a href="#" class="test"&gt;Test&lt;/a&gt;
  
  &lt;style type="text/css"&gt;
  .test {
  border: thin solid blue;
  color: red;
  }
  &lt;/style&gt;
  </code></pre>
  
  <p>This only creates the border but doesn't turn the text red when using a class.</p>
  
  <p>However, this works in turning the text red when using an id instead:</p>
  
  <pre><code>&lt;a href="#" id="test"&gt;Test&lt;/a&gt;
  
  &lt;style type="text/css"&gt;
  #test {
  border: thin solid blue;
  color: red;
  }
  &lt;/style&gt;
  </code></pre>
  
  <p>Why does the class not change the text color, while using id does work?</p>
  
  <p>Thanks!</p>