0

Totally puzzled by this very basic rules of giving a background color differently to odd and even to each list element (each <li>)

In the rendered html code, ALL li are seen as odd.. ?????? so they all got the same background color instead of the needed alternate one.

Thank for any help.

<div id="technotes" class="block nb-coul well">
<div class="block-in">

<ul id="blocNotesTech">
         <li class="oneFile gc tips ">
 <a target="_blank" rel="tooltip" href="http:xxxx.pdf" title="" data-original-title="Enregistrer ce document (nl onglet) "><strong>xxxxxxxxxxxxxxxxx </strong>&nbsp;» 
</a> &nbsp;<span class="tout-pt-txt small">(0.16 Mo) </span><br>
<cite class="tout-pt-txt"><em>azertyui...</em>
</cite>

</li><br>
 <li class="oneFile hplc ">
 <a target="_blank" rel="tooltip" href="http:xxxx.pdf" title="" data-original-title="Enregistrer ce document (nl onglet) "><strong>xxxxxxxxxxxxxxxxx </strong>&nbsp;» 
</a> &nbsp;<span class="tout-pt-txt small">(0.16 Mo) </span><br>
<cite class="tout-pt-txt"><em>azertyui...</em>
</cite>


</li><br>
 <li class="oneFile gc tips ">
 <a target="_blank" rel="tooltip" href="http:xxxx.pdf" title="" data-original-title="Enregistrer ce document (nl onglet) "><strong>xxxxxxxxxxxxxxxxx </strong>&nbsp;» 
</a> &nbsp;<span class="tout-pt-txt small">(0.16 Mo) </span><br>
<cite class="tout-pt-txt"><em>azertyui...</em>
</cite>


</li><br>
 <li class="oneFile hplc ">
 <a target="_blank" rel="tooltip" href="http:xxxx.pdf" title="" data-original-title="Enregistrer ce document (nl onglet) "><strong>xxxxxxxxxxxxxxxxx </strong>&nbsp;» 
</a> &nbsp;<span class="tout-pt-txt small">(0.16 Mo) </span><br>
<cite class="tout-pt-txt"><em>azertyui...</em>
</cite>


</li><br>

</ul>

</div>

and the css that applies (tried different ways):

#technotes li{
    display: inline-block;
    background: none;
    background-position: center left!important;
    padding: 43px 2px 43px 72px!important;
    font-size: 130%;
    border-bottom: 1px blue !important;
}
#technotes li.hplc{
    background-image: url(../img/TechNoteHPLC-ico.png);
        background-repeat: no-repeat;

}
#technotes li.hplc-usp{
    background-image: url(../img/TechNoteHPLCUSP-ico.png);
        background-repeat: no-repeat;

}
#technotes li.gc{
    background-image: url(../img/TechNoteGC-ico.png);
        background-repeat: no-repeat;

}
#technotes ul > li:nth-child(odd){
    background-color: #f9f9f9;
}
#technotes ul > li:nth-child(even){
    background-color: #ECEDE6;
}
Paulie_D
  • 107,962
  • 13
  • 142
  • 161
user1011212
  • 39
  • 1
  • 8

1 Answers1

0

grrr. the <br /> outside the LIs was the issue... must be inside. solved..

user1011212
  • 39
  • 1
  • 8