CSS - Comment sélectionner un id à l'intérieur d'une classe

J'ai plusieurs tables. J'ai donc utiliser un datatable.css. Pour faire face à l'en-tête-je utiliser

     .order-table-header{}

(donc j'utilise une classe d'en-tête)

Je veux maintenant pour différencier mes tables donc, logiquement, l'utilisation d'un identifiant, quelque chose comme ça :

#Other{}

Mais il ne veut pas faire ce qui est à l'intérieur de la #{Autre}

voici mon code :

.order-table-header{
text-align:center;
background:none repeat scroll 0 0 #dddddd;
border-bottom:1px solid #BBBBBB;
padding:16px;
width: 8%;
background-color: #0099cc;
color: #ffffff;
line-height: 3px;
}
#Other .order-table-header{
background-color: #00ff00;
}

J'ai essayé dans l'autre sens

 .order-table-header #Other{}

J'ai essayé avec tout les autres

#Other{}

Voici mon code xhtml :

      <h:dataTable value="#{workspace.otherfiles}" 
                   var="item"
                   styleClass="datatable.css"
                   headerClass="order-table-header"
                   rowClasses="order-table-odd-row, order-table-even-row"
                   id="Other">

J'ai aussi essayé :

.order-table-header(@background : #0099cc){
text-align:center;
background:none repeat scroll 0 0 #dddddd;
border-bottom:1px solid #BBBBBB;
padding:16px;
    width: 8%;

    background-color: @background;

    color: #ffffff;
    line-height: 3px;
}
#Other {
 .order-table-header(#00ff00);
}

mais netbeans me dire symbole inattendu trouvé pour la première ligne et de la ligne à l'intérieur d'autres

OriginalL'auteur SabineA | 2012-03-11