# Custom class in Accordion

**URL:** <https://forum.radzen.com/t/custom-class-in-accordion/9012>\
**Category:** Blazor Server\
**Created:** [September 20, 2021, 9:38pm UTC](https://forum.radzen.com/t/custom-class-in-accordion/9012 "2021-09-20T21:38:08Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Mario](https://forum.radzen.com/letter_avatar_proxy/v4/letter/m/8e7dd6/32.png) [@Mario](https://forum.radzen.com/u/Mario)\
**Post date:** [September 20, 2021, 9:38pm UTC](https://forum.radzen.com/t/custom-class-in-accordion/9012/1 "2021-09-20T21:38:08Z")

</div>

Hi, I need to change the style of accordion's content. Padding specifically. I've tried adding my custom class to RadzenAccordion and RadzenAccordionItem but it doesn't work. It's placed into another div. The class I need to replace is 'rz-accordion-content'. Any clue? Thanks.

```auto
 <RadzenAccordion Multiple="false">
                    <Items >
                        <RadzenAccordionItem class="rz-accordion-content-class" Text=@localizer["docresponsibilitiesaccordionheader"] Icon="files" Selected=@bResponsibility Style="@sStyleResponsibility">
                            <table class="table" style="width: 100%; word-wrap: break-word; table-layout: fixed;">
                                <thead style="font-size:12px;">
                                    <tr>
                                        <th>@localizer["docresponsibilitiesaccordiontableheadername"]</th>                                        
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach (var docResp in documentResponsibilities)
                                    {
                                        <tr>
                                            <td><b>@docResp.Name</b></td>                                           
                                        </tr>
                                    }
                                </tbody>
                            </table>
                        </RadzenAccordionItem>
                    </Items>
                </RadzenAccordion>

```

 ![Untitled](https://forum.radzen.com/uploads/default/original/2X/a/a1b688ce8fe257bb2fff030d0f5094d33f0be30e.jpeg)

---

<div class="post-metadata">

**Author:** ![korchev](https://forum.radzen.com/user_avatar/forum.radzen.com/korchev/32/4_2.png) [@korchev](https://forum.radzen.com/u/korchev)\
**Post date:** [September 21, 2021, 5:56am UTC](https://forum.radzen.com/t/custom-class-in-accordion/9012/2 "2021-09-21T05:56:24Z")

</div>

You can combine selectors to target that specific class - for example [adjacent](https://developer.mozilla.org/en-US/docs/Web/CSS/Adjacent_sibling_combinator) and child selectors.

```auto
.rz-accordion-content-class + .rz-accordion-content-wrapper .rz-accordion-content {
  padding: 20px;
}

```

---

<div class="post-metadata">

**Author:** ![Mario](https://forum.radzen.com/letter_avatar_proxy/v4/letter/m/8e7dd6/32.png) [@Mario](https://forum.radzen.com/u/Mario)\
**Post date:** [September 21, 2021, 11:39pm UTC](https://forum.radzen.com/t/custom-class-in-accordion/9012/3 "2021-09-21T23:39:04Z")

</div>

It worked! Thanks again.