Appliquer la zébrure à l'accordéon jQueryUI

Question

J'ai une application mvc asp.net qui construit un accordéon basé sur le plugin jQueryUI Accordion - je voudrais appliquer la zébrure.

est ici la boucle constructeur:

<div id="accordion">  
    <% 
     foreach (var webinar in Model as IList<Webinar>) 
     { %> 
     <div id="accordionItem">//toDo: Programmically pick odd/even rows 
     <div class="accStripe"> //insert a div for even rows 
      <h3><a href="#"><b><%= myObj.Title%></h3> 
      <div id="descContent"> 
       <a href="Details/<% =myObj.ID %>"><%= myObj.Desc%> ...more</a> 
      </div> 
     </div>  
     </div> 
    <% } %> 
</div> 

Ensuite, la règle de accStripe:

.accStripe{ 
    background:#F7EEDC none repeat scroll 0 0; 
    border-bottom:1px dotted #DFAC45; 
} 

Je suis en mesure de pick-up de la frontière en pointillé, mais pas la couleur d'arrière-plan. Je suppose que cela serait dû à une plus grande spécificité de la part de la .ui-accordion-header? A quelle profondeur devrais-je creuser pour trouver comment contourner cela?

Answer 1

Richard D. Worth jquery-ui fournit la réponse:

Votre élément d'emballage (.accStripe) contient deux enfants, .ui-accordéon-tête et .ui-accordéon, chacun ont des antécédents:

.accStripe { background:#F7EEDC none repeat scroll 0 0; border-bottom:1px dotted #DFAC45; } 
.accStripe .ui-accordion-header { background:#F7EEDC none repeat scroll 0 0; } 
.accStripe .ui-accordion-content { background:#F7EEDC none repeat scroll 0 0; }