# Image display in carousel/gallery

**URL:** <https://community.glideapps.com/t/image-display-in-carousel-gallery/72793>\
**Category:** Ask for Help\
**Created:** [April 22, 2024, 3:39pm UTC](https://community.glideapps.com/t/image-display-in-carousel-gallery/72793 "2024-04-22T15:39:25Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![Hicham\_AMROUSSI](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/hicham_amroussi/32/73981_2.png) [@Hicham\_AMROUSSI](https://community.glideapps.com/u/Hicham_AMROUSSI)\
**Post date:** [April 22, 2024, 3:39pm UTC](https://community.glideapps.com/t/image-display-in-carousel-gallery/72793/1 "2024-04-22T15:39:25Z")

</div>

Hello everyone.  
I made an image carousel on my glide app and I have a problem with how some images look in it. The images that have been taken in portrait mode look zoomed in (as the image below shows it). Is there a way to show the entire image ?

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/4/f/4ff7d9a23f7f204b2d2758d2868c331efc194c7f.jpeg)

The original image :

 ![WhatsApp Image 2024-04-13 at 22.21.34(1)](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/3/4/345d86b2ab10250e9bfc9844af464780846f7511.webp)

---

<div class="post-metadata">

**Author:** ![Eric\_Penn](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/eric_penn/32/73888_2.png) [@Eric\_Penn](https://community.glideapps.com/u/Eric_Penn)\
**Post date:** [April 22, 2024, 4:23pm UTC](https://community.glideapps.com/t/image-display-in-carousel-gallery/72793/2 "2024-04-22T16:23:43Z")

</div>

Does it help if you change the Aspect Ratio to auto… and size full?

---

<div class="post-metadata">

**Author:** ![Hicham\_AMROUSSI](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/hicham_amroussi/32/73981_2.png) [@Hicham\_AMROUSSI](https://community.glideapps.com/u/Hicham_AMROUSSI)\
**Post date:** [April 23, 2024, 8:39am UTC](https://community.glideapps.com/t/image-display-in-carousel-gallery/72793/3 "2024-04-23T08:39:28Z")

</div>

I tried it and the image is too big on larger screens.

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/0/e/0e195eba981d678e96cffe3cdf089ded1681db11.jpeg)

Is there a way to add CSS or is it not included in the legacy starter plan ?

---

<div class="post-metadata">

**Author:** ![Himaladin](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/himaladin/32/71023_2.png) [@Himaladin](https://community.glideapps.com/u/Himaladin)\
**Post date:** [April 23, 2024, 10:00am UTC](https://community.glideapps.com/t/image-display-in-carousel-gallery/72793/4 "2024-04-23T10:00:49Z")

</div>

```auto
.align-center div.is-carousel > img {
  object-fit: contain; 
}

```

---

<div class="post-metadata">

**Author:** ![Hicham\_AMROUSSI](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/hicham_amroussi/32/73981_2.png) [@Hicham\_AMROUSSI](https://community.glideapps.com/u/Hicham_AMROUSSI)\
**Post date:** [April 23, 2024, 10:24am UTC](https://community.glideapps.com/t/image-display-in-carousel-gallery/72793/5 "2024-04-23T10:24:53Z")

</div>

The thing is that I think I can’t add custom CSS… I have tried a way I found on the community here which consists in adding `<pre><span><style>` to a rich text component and then writing the CSS but it’s an outdated solution, I think it’s not working anymore, is it ?

---

<div class="post-metadata">

**Author:** ![Himaladin](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/himaladin/32/71023_2.png) [@Himaladin](https://community.glideapps.com/u/Himaladin)\
**Post date:** [April 23, 2024, 10:36am UTC](https://community.glideapps.com/t/image-display-in-carousel-gallery/72793/6 "2024-04-23T10:36:16Z")

</div>

Did you check your “Settings \> Appearance” section? For new applications, you can no longer use richtext components to write CSS.

---

<div class="post-metadata">

**Author:** ![Hicham\_AMROUSSI](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/hicham_amroussi/32/73981_2.png) [@Hicham\_AMROUSSI](https://community.glideapps.com/u/Hicham_AMROUSSI)\
**Post date:** [April 23, 2024, 11:05am UTC](https://community.glideapps.com/t/image-display-in-carousel-gallery/72793/7 "2024-04-23T11:05:00Z")

</div>

Yes I did, it should be at the bottom of the appareance section but there is nothing.

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/2/6/26096c8b46b41f8b5b4458e8f7fa501c8a5627e2.png)

So I guess the only solution left is tu upgrade to another plan to be able to write custom CSS ? do you have any idea for how long legacy plans are left before you’re forced to switch or something ?

---

<div class="post-metadata">

**Author:** ![Himaladin](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/himaladin/32/71023_2.png) [@Himaladin](https://community.glideapps.com/u/Himaladin)\
**Post date:** [April 23, 2024, 11:13am UTC](https://community.glideapps.com/t/image-display-in-carousel-gallery/72793/8 "2024-04-23T11:13:31Z")

</div>

As for the timeframe for legacy plans before being forced to switch, I’m not sure. However, I have seen warnings in my classic application.

---

<div class="post-metadata">

**Author:** ![Hicham\_AMROUSSI](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/hicham_amroussi/32/73981_2.png) [@Hicham\_AMROUSSI](https://community.glideapps.com/u/Hicham_AMROUSSI)\
**Post date:** [April 23, 2024, 2:36pm UTC](https://community.glideapps.com/t/image-display-in-carousel-gallery/72793/9 "2024-04-23T14:36:11Z")

</div>

Strange, I have none of that on my app. anyways, thanks a lot for your time and for your help, @Eric_Penn Thank you too.

---

<div class="post-metadata">

**Author:** ![Jeff\_Hager](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jeff_hager/32/43_2.png) [@Jeff\_Hager](https://community.glideapps.com/u/Jeff_Hager)\
**Post date:** [April 23, 2024, 2:53pm UTC](https://community.glideapps.com/t/image-display-in-carousel-gallery/72793/10 "2024-04-23T14:53:33Z")

</div>

Which plan are you on? CSS is available on all new paid plans. For legacy plans, I think it’s only available for Business plans and up.

---

<div class="post-metadata">

**Author:** ![Hicham\_AMROUSSI](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/hicham_amroussi/32/73981_2.png) [@Hicham\_AMROUSSI](https://community.glideapps.com/u/Hicham_AMROUSSI)\
**Post date:** [April 24, 2024, 8:12am UTC](https://community.glideapps.com/t/image-display-in-carousel-gallery/72793/11 "2024-04-24T08:12:07Z")

</div>

I am on the legacy starter plan so I don’t think custom CSS is available for me. I have no idea when I’ll have to switch to the new plans too…