# How to move event button under description in the event card

**URL:** <https://community.elfsight.com/t/how-to-move-event-button-under-description-in-the-event-card/153497>\
**Category:** Customization\
**Tags:** event-calendar\
**Created:** [April 9, 2026, 4:54am UTC](https://community.elfsight.com/t/how-to-move-event-button-under-description-in-the-event-card/153497 "2026-04-09T04:54:19Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![user35347](https://avatars.discourse-cdn.com/v4/letter/u/7ba0ec/32.png) [@user35347](https://community.elfsight.com/u/user35347)\
**Post date:** [April 9, 2026, 4:54am UTC](https://community.elfsight.com/t/how-to-move-event-button-under-description-in-the-event-card/153497/1 "2026-04-09T04:54:19Z")

</div>

It would be great to be able to move the button in an event, say from the top of the description to the bottom of the description, so people can read about the event first and then decide to buy a ticket or not.

---

<div class="post-metadata">

**Author:** ![Max](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/max/32/710_2.png) [@Max](https://community.elfsight.com/u/Max)\
**Post date:** [April 9, 2026, 12:18pm UTC](https://community.elfsight.com/t/how-to-move-event-button-under-description-in-the-event-card/153497/3 "2026-04-09T12:18:58Z")

</div>

Greetings and welcome aboard, @user35347 👋

Great news - you can achieve this with this code added to the **Custom CSS** field on the **Style** tab of your widget’s settings:

```auto
.eapp-events-calendar-grid-item-imageContainer {
  padding-top: 127% !important;
}

.eapp-events-calendar-grid-item-info {
  display: flex;
  flex-direction: column;
}

.eapp-events-calendar-grid-item-button {
  order: 5;
  margin: 8px 0;
}

```

  

Please try it out and let me know if it helped 😉

---

<div class="post-metadata">

**Author:** ![user35347](https://avatars.discourse-cdn.com/v4/letter/u/7ba0ec/32.png) [@user35347](https://community.elfsight.com/u/user35347)\
**Post date:** [April 12, 2026, 10:01pm UTC](https://community.elfsight.com/t/how-to-move-event-button-under-description-in-the-event-card/153497/4 "2026-04-12T22:01:15Z")

</div>

> [@Max](#):
>
> ```auto
> .eapp-events-calendar-grid-item-imageContainer {
> padding-top: 127% !important;
> }
> 
> .eapp-events-calendar-grid-item-info {
> display: flex;
> flex-direction: column;
> }
> 
> .eapp-events-calendar-grid-item-button {
> order: 5;
> margin: 8px 0;
> }
> 
> ```

Max, you are amazing, thank you so much!

---

<div class="post-metadata">

**Author:** ![Max](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/max/32/710_2.png) [@Max](https://community.elfsight.com/u/Max)\
**Post date:** [April 13, 2026, 10:15am UTC](https://community.elfsight.com/t/how-to-move-event-button-under-description-in-the-event-card/153497/5 "2026-04-13T10:15:43Z")

</div>

It’s my pleasure!

Feel free to ask questions if anything comes up again. We’ll be delighted to help 😊