# Displaying Vertical Videos

**URL:** <https://community.elfsight.com/t/displaying-vertical-videos/5354>\
**Category:** YouTube Gallery\
**Tags:** Gathering-Feedback\
**Created:** [May 30, 2022, 9:12am UTC](https://community.elfsight.com/t/displaying-vertical-videos/5354 "2022-05-30T09:12:20Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![Marina](https://avatars.discourse-cdn.com/v4/letter/m/f05b48/32.png) [@Marina](https://community.elfsight.com/u/Marina)\
**Post date:** [May 30, 2022, 9:12am UTC](https://community.elfsight.com/t/displaying-vertical-videos/5354/1 "2022-05-30T09:12:20Z")

</div>

Can you force the videos to be vertical in the Youtube widget? There isn’t an option for this in the app settings.

---

<div class="post-metadata">

**Author:** ![Helga](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/helga/32/1155_2.png) [@Helga](https://community.elfsight.com/u/Helga)\
**Post date:** [October 11, 2022, 12:00am UTC](https://community.elfsight.com/t/displaying-vertical-videos/5354/2 "2022-10-11T00:00:00Z")

</div>

Folks, our former Wishlist portal, where our users shared their requests and suggestions, was transferred to this forum. You’re most welcome to vote, add new ideas, and leave your comments here — we surely will consider them all! 🤩

Original Votes: 1

---

<div class="post-metadata">

**Author:** ![Helga](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/helga/32/1155_2.png) [@Helga](https://community.elfsight.com/u/Helga)\
**Post date:** [May 31, 2022, 12:00am UTC](https://community.elfsight.com/t/displaying-vertical-videos/5354/3 "2022-05-31T00:00:00Z")

</div>

Hi Marina,

Thank you for adding your suggestion!

We’ll try our best to consider your idea, and hopefully we’ll manage to release it in one of the future updates.

Thanks a lot for your help!

---

<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 16, 2024, 12:39pm UTC](https://community.elfsight.com/t/displaying-vertical-videos/5354/4 "2024-04-16T12:39:22Z")

</div>

A post was split to a new topic: [Change YG Video order](https://community.elfsight.com/t/change-yg-video-order/47730)

---

<div class="post-metadata">

**Author:** ![Utku](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/utku/32/12179_2.png) [@Utku](https://community.elfsight.com/u/Utku)\
**Post date:** [May 19, 2025, 8:17am UTC](https://community.elfsight.com/t/displaying-vertical-videos/5354/6 "2025-05-19T08:17:41Z")

</div>

Is this still not completed??

---

<div class="post-metadata">

**Author:** ![Helga](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/helga/32/1155_2.png) [@Helga](https://community.elfsight.com/u/Helga)\
**Post date:** [May 19, 2025, 8:36am UTC](https://community.elfsight.com/t/displaying-vertical-videos/5354/7 "2025-05-19T08:36:46Z")

</div>

Hi @Utku!

Yes, I’m afraid we don’t have any news about this feature request 😞 But we’ll make sure to post here if anything changes 🙌🏻

---

<div class="post-metadata">

**Author:** ![Kate4](https://avatars.discourse-cdn.com/v4/letter/k/3d9bf3/32.png) [@Kate4](https://community.elfsight.com/u/Kate4)\
**Post date:** [July 19, 2025, 6:56pm UTC](https://community.elfsight.com/t/displaying-vertical-videos/5354/8 "2025-07-19T18:56:36Z")

</div>

I would like to upvote the need for a Vertical Video display player. Squarespace, especially, is lacking the functionality for vertical videos. Would love to auto-play videos and not use the social media embeds. Those are my main reasons for wanting it here.

---

<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:** [July 21, 2025, 12:02pm UTC](https://community.elfsight.com/t/displaying-vertical-videos/5354/9 "2025-07-21T12:02:21Z")

</div>

Hey there, @Kate4 👋

Thank you so much for upvoting the idea and sharing your reasons - that’s much appreciated 🙂

---

<div class="post-metadata">

**Author:** ![Lucienne\_Broere](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/lucienne_broere/32/36647_2.png) [@Lucienne\_Broere](https://community.elfsight.com/u/Lucienne_Broere)\
**Post date:** [January 30, 2026, 11:11am UTC](https://community.elfsight.com/t/displaying-vertical-videos/5354/10 "2026-01-30T11:11:19Z")

</div>

Hello for me, the css code did not work. This code worked for me:

```auto
/* =========================
   VERTICALE REEL 2/3 FORMAT + SPACING
   ========================= */

/* Container: verticale reel */
.yottie-widget-video,
.yottie-widget-video-preview-thumbnail {
  width: 100% !important; /* vult horizontaal */
  max-width: 400px !important; /* optioneel voor desktop */
  height: calc(66vh - 20px) !important; /* 2/3 van viewport minus 20px ruimte */
  overflow: hidden !important;
  position: relative !important;
  margin: 0px 10px 0px 0px !important; /* 10px boven en onder, center horizontaal */
  border-radius: 12px; /* optioneel: zachte hoeken */
  box-shadow: 0 4px 12px rgba(0,0,0,0.1); /* subtiele schaduw */
}

/* Video / iframe: crop en center */
.yottie-widget-video iframe,
.yottie-widget-video video {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: auto !important;
  height: 100% !important; /* vult container hoogte */
  transform: translate(-50%, -50%) !important;
  object-fit: cover !important; /* crop video naar container */
  display: block !important;
}

/* Thumbnails: zelfde styling als video */
.yottie-widget-video-preview-thumbnail img {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: auto !important;
  height: 100% !important;
  transform: translate(-50%, -50%) !important;
  object-fit: cover !important;
  display: block !important;
}

/* Slides centreren */
.yottie-widget-feed-section-slide {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

/* Responsive: kleiner scherm */
@media (max-width: 480px) {
  .yottie-widget-video,
  .yottie-widget-video-preview-thumbnail {
    max-width: 100% !important;
    height: calc(66vh - 20px) !important;
  }
}

```

---

<div class="post-metadata">

**Author:** ![Lucienne\_Broere](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/lucienne_broere/32/36647_2.png) [@Lucienne\_Broere](https://community.elfsight.com/u/Lucienne_Broere)\
**Post date:** [January 30, 2026, 11:12am UTC](https://community.elfsight.com/t/displaying-vertical-videos/5354/11 "2026-01-30T11:12:10Z")

</div>

Hopefully it will help also for other YouTube Short video size seekers.

---

<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:** [January 30, 2026, 12:19pm UTC](https://community.elfsight.com/t/displaying-vertical-videos/5354/12 "2026-01-30T12:19:15Z")

</div>

Hi there, @Lucienne_Broere 👋

Thank you so much for the feedback!

If you’re referring to this [CSS code](https://community.elfsight.com/t/vertical-video-display-like-shorts/76450), I’ve just tested and it worked fine.

However, your solution is great too and I think it work better for your use case. Thanks a lot for sharing it with us 😊

---

<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:** [September 1, 2026, 1:35pm UTC](https://community.elfsight.com/t/displaying-vertical-videos/5354/14 "2026-09-01T13:35:37Z")

</div>

Hey everyone!

Although this feature isn’t supported in the YouTube Gallery app, the good news is that you can now display Shorts in a native vertical format using our new **[Video Gallery](https://elfsight.com/video-gallery-widget/)** app! 🎉

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/5/a/5a955da60312d8bf9fe5f4b4bda88edb92bee178.png) ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/7/c/7c7ea38c75f64bc8a91778aadaa47d37b2cb6e1b.png)

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/9/1/91ab7e4ff76dc852de8b046daeea6bd45c5d996a.jpeg)

  

Give it a shot and let us know what you think 🙂
