# Split the title into two lines

**URL:** <https://community.elfsight.com/t/split-the-title-into-two-lines/107534>\
**Category:** Customization\
**Tags:** event-calendar\
**Created:** [March 17, 2025, 12:52pm UTC](https://community.elfsight.com/t/split-the-title-into-two-lines/107534 "2025-03-17T12:52:40Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![user2486](https://avatars.discourse-cdn.com/v4/letter/u/8baadc/32.png) [@user2486](https://community.elfsight.com/u/user2486)\
**Post date:** [March 17, 2025, 12:52pm UTC](https://community.elfsight.com/t/split-the-title-into-two-lines/107534/1 "2025-03-17T12:52:40Z")

</div>

Hello everyone, the question is quite simple: is it possible to split the title into two lines? Thanks!

---

<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:** [March 17, 2025, 3:16pm UTC](https://community.elfsight.com/t/split-the-title-into-two-lines/107534/4 "2025-03-17T15:16:52Z")

</div>

Hi there, @user2486 👋

I’ve checked your widget and see that it doesn’t have a title. Could you please specify the title you’re going to use?

---

<div class="post-metadata">

**Author:** ![user2486](https://avatars.discourse-cdn.com/v4/letter/u/8baadc/32.png) [@user2486](https://community.elfsight.com/u/user2486)\
**Post date:** [March 17, 2025, 6:44pm UTC](https://community.elfsight.com/t/split-the-title-into-two-lines/107534/5 "2025-03-17T18:44:22Z")

</div>

Hi Max,  
sorry I Mean the titles of the events, the Event Name, not the general title 😅

---

<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:** [March 17, 2025, 7:23pm UTC](https://community.elfsight.com/t/split-the-title-into-two-lines/107534/6 "2025-03-17T19:23:41Z")

</div>

Ah, got it!

Only the part in the brackets should be moved to the 2nd line, am I right?

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/2/9/29c76f456d6d551f860fd0492c14f5711c37c5f6.png)

---

<div class="post-metadata">

**Author:** ![user2486](https://avatars.discourse-cdn.com/v4/letter/u/8baadc/32.png) [@user2486](https://community.elfsight.com/u/user2486)\
**Post date:** [March 17, 2025, 9:34pm UTC](https://community.elfsight.com/t/split-the-title-into-two-lines/107534/7 "2025-03-17T21:34:13Z")

</div>

Perfectly

---

<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:** [March 18, 2025, 11:17am UTC](https://community.elfsight.com/t/split-the-title-into-two-lines/107534/8 "2025-03-18T11:17:39Z")

</div>

Got it, thanks!

Please add this code to the Custom CSS field on the Style tab of your widget’s settings and let me know if you like the result:

```auto
.fc-event-title {
      display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    line-height: 1.2em;
    max-height: 2.4em;
    word-wrap: break-word;
    max-width: 200px;
}

```

---

<div class="post-metadata">

**Author:** ![user2486](https://avatars.discourse-cdn.com/v4/letter/u/8baadc/32.png) [@user2486](https://community.elfsight.com/u/user2486)\
**Post date:** [March 18, 2025, 2:32pm UTC](https://community.elfsight.com/t/split-the-title-into-two-lines/107534/9 "2025-03-18T14:32:09Z")

</div>

Thanks for the code, but I would like to split lines in a specific point, like a   
 tag in HTML, or something like a subtitle. What do you think?

---

<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:** [March 18, 2025, 3:36pm UTC](https://community.elfsight.com/t/split-the-title-into-two-lines/107534/10 "2025-03-18T15:36:29Z")

</div>

There is no way to add `<br>` tag like in HTML, but the title can be moved after reaching a certain number of characters on the 1st line. Does it work for you?

If yes, please specify the number of characters you’d like to have on the 1st line.
