Verstaendnisproblem: Ueberschreibung/Gewichtung von CSS

[Christoph]

Guten Tag,

ich habe, wie es scheint, ein Verstaendnisproblem bezgl. der
Gewichtung von CSS-Angaben.

Mein Code ist wie folgt:

  
<div id="col1_content">  
<ul>  
  <li>Lorem Ipsum</li>  
  <li>Lorem Ipsum</li>  
  <li>Lorem Ipsum</li>  
  <li>Lorem Ipsum</li>  
  <li>Lorem Ipsum</li>  
  <li id="subnavi_current">  
    Lorem Ipsum  
    <ul>  
        <li>Ipsum Bla Blub</li>  
        <li>sum BlubBla</li>  
        <li>Ipsum BlaBlub</li>  
    </ul>  
  </li>  
</ul>  
</div>  

  
#col1_content li  
{  
  list-style: none;  
  background-image: url(../../img/navigation_arrow.gif);  
  background-repeat:no-repeat;  
  background-position:right;  
}  
  
#subnavi_current  
{  
  list-style: none;  
  background-image: url(../../img/navigation_arrow_active.gif);  
  background-repeat:no-repeat;  
  background-position:right;  
}  

Ich haette jetzt angenommen, dass das ListItem (id="subnavi_current")
die Hintergrundgrafik "navigation_arrow_active.gif" bekommt.
Sprich, dass das Stylesheet "#subnavi_current" die Angaben von
"#col1_content li" ueberschreibt.
Dem ist aber nicht so.

Kann mir einer erklaeren warum das so ist? Bzw. mir evtl. einen Link
schicken, wo ich mich mal schlau machen kann?

Besten Dank,
Christopher