Rajeev Kumar

Rajeev Kumar

  • NA
  • 334
  • 138.7k

accordion problem

Oct 25 2013 1:47 AM
im using this code for accordion  panel in asp.net but it is not working  please help me.
 
<style type="text/css"> 
        .accordion { 
            width: 400px; 
        } 
         
        .accordionHeader { 
            border: 1px solid #2F4F4F; 
            color: white; 
            background-color: #2E4d7B; 
            font-family: Arial, Sans-Serif; 
            font-size: 12px; 
            font-weight: bold; 
            padding: 5px; 
            margin-top: 5px; 
            cursor: pointer; 
        } 
         
        .accordionHeaderSelected { 
            border: 1px solid #2F4F4F; 
            color: white; 
            background-color: #5078B3; 
            font-family: Arial, Sans-Serif; 
            font-size: 12px; 
            font-weight: bold; 
            padding: 5px; 
            margin-top: 5px; 
            cursor: pointer; 
        } 
         
        .accordionContent { 
            background-color: #D3DEEF; 
            border: 1px dashed #2F4F4F; 
            border-top: none; 
            padding: 5px; 
            padding-top: 10px; 
        } 
    </style> 



  <form id="form1" runat="server">
   <div>
      <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
       <asp:Accordion  
    ID="Accordion1"  
    runat="server"
     HeaderCssClass="accordionHeader" 
    HeaderSelectedCssClass="accordionHeaderSelected" 
    ContentCssClass="accordionContent" > 
<Panes> 
    <asp:AccordionPane ID="AccordionPane1" runat="server"> 
        <Header>Pane 1</Header> 
        <Content> 
       my first panel
        </Content> 
    </asp:AccordionPane> 
    <asp:AccordionPane ID="AccordionPane2" runat="server"> 
        <Header>Pane 2</Header> 
        <Content> 
       my Second panel
        </Content> 
    </asp:AccordionPane> 
    <asp:AccordionPane ID="AccordionPane3" runat="server"> 
        <Header>Pane 3</Header> 
        <Content> 
       my third panel
        </Content> 
    </asp:AccordionPane> 
</Panes> 
</asp:Accordion> 
   
    </div>
 
    </form>

Answers (2)