title: CSS: Changing Span color on mouseover
body: <p>How should I go about changing the color of a span on mouseover? I currently have a tab (like in a menu) that has been classified as a span, let's say .rtsOut with a background color of #595959. Each tab is still classified as the same span, .rtsOut, but is divided into 4 different tabs. When I mouseover, I'd like to change that one tab to to, #000000, and to revert back to #595959 when the mouse is moved off of the span.</p>
  
  <p>I unfortunately don't have access to the whole overlook of CSS like so:</p>
  
  <pre><code>&lt;style&gt;
  span:hover {
    background: ######;
  }
  &lt;/style&gt;
  </code></pre>
  
  <p>and instead I have a very simple view like this, where I just input single lines of code:</p>
  
  <pre><code>#SampleThing {visibility: hidden;}
  </code></pre>
  
  <p>Can anyone help me? I've been Googling, and testing for hours, and can't come up with a solution.</p>
  
  <p>So far, this is what I've found. I believe this is how the span has been created:</p>
  
  <pre><code> &lt;li class="rtsLI"&gt; == $0
        &lt;a class="rtsLink tbLeft4" id="TbInformation" href="../Info/Info.aspx"&gt;
             &lt;span class="rtsOut"&gt;
                  &lt;span class="rtsIn"&gt;
                       &lt;span class="rtsTxt"&gt;Edit Information&lt;/span&gt;
                  &lt;/span&gt;
             &lt;/span&gt;
        &lt;/a&gt;
   &lt;/li&gt;
  </code></pre>
  
  <p>And I've tried changing the background color of that span using this:</p>
  
  <pre><code> .rtsOut:hover {background: #000000;}
  </code></pre>
  
  <p>However, that line of code isn't working :(</p>