# Image component - label

**URL:** https://community.glideapps.com/t/image-component-label/73908
**Category:** Ask for Help
**Created:** [June 5, 2024, 11:33pm UTC](https://community.glideapps.com/t/image-component-label/73908 "2024-06-05T23:33:49Z")
**Posts on this page:** 7
**Page:** 1

<div class="post-metadata">

### Author: ![Dan\_San](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dan_san/32/24085_2.png) [@Dan\_San](https://community.glideapps.com/u/Dan_San)
#### Post date: [June 5, 2024, 11:33pm UTC](https://community.glideapps.com/t/image-component-label/73908/1 "2024-06-05T23:33:50Z")

</div>

I am using image component to display a multi-image column

1. I want to create/show a label (description to what these images are) Is that possible without using a separate Text Component

2. Also what does the Alt Text option do, I am playing around with it but nothing seems to happen

---

<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: [June 6, 2024, 2:01am UTC](https://community.glideapps.com/t/image-component-label/73908/2 "2024-06-06T02:01:54Z")

</div>

> [@film\_strip 2. Transforming Card Collection into a Slide-In Carousel with CSS](https://community.glideapps.com/t/2-transforming-card-collection-into-a-slide-in-carousel-with-css/73400/14):
>
> @Sekayi_Liburd, If you use text, remove this part: [ScreenRecording2024-05-16at14.09.32-ezgif.com-crop] Rotate Text /\*VERTICAL TEXT\*/ .cardousel .horizontal \> div { flex-direction: row; } .cardousel .horizontal \> div \> div \> div:nth-child(2) { position: absolute; right: 105px; width: calc(2/3 \* 100%); min-width: calc(2/3 \* 100%); top: 0px; padding:15px; transform: rotate(-90deg) translateY(0%); transform-origin: top right; background: rgba(0, 0, 0, 0.5); } .mobile-layer .…

---

<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: [June 6, 2024, 12:21pm UTC](https://community.glideapps.com/t/image-component-label/73908/3 "2024-06-06T12:21:58Z")

</div>

> [@Dan\_San](#):
>
> what does the Alt Text option do

Alt Text is what you see when you hover over an image on the web or is displayed when the image is unavailable. It’s used to provide a description of the image and in many cases is used by screen readers for the visually impaired. All it does is add an alt attribute to the image HTML tag.

---

<div class="post-metadata">

### Author: ![Dan\_San](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dan_san/32/24085_2.png) [@Dan\_San](https://community.glideapps.com/u/Dan_San)
#### Post date: [June 6, 2024, 1:06pm UTC](https://community.glideapps.com/t/image-component-label/73908/4 "2024-06-06T13:06:24Z")

</div>

Thank Himaladin,

You are our resident/community CSS expert. I am sure you are extending the features/functionality of Glide in your apps.

I will invest my time/research into deciphering the thread.

Thanks and greatly appreciated.

---

<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: [June 12, 2024, 5:12am UTC](https://community.glideapps.com/t/image-component-label/73908/5 "2024-06-12T05:12:01Z")

</div>

![ScreenRecording2024-06-12at12.03.00-ezgif.com-video-to-webp-converter](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/1/6/16f5b805ad4d30519a96c0207a5161bc21a543df.webp)

---

<div class="post-metadata">

### Author: ![Dan\_San](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dan_san/32/24085_2.png) [@Dan\_San](https://community.glideapps.com/u/Dan_San)
#### Post date: [June 13, 2024, 11:56pm UTC](https://community.glideapps.com/t/image-component-label/73908/6 "2024-06-13T23:56:33Z")

</div>

wow… how is that done ? In CSS ?

---

<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: [June 14, 2024, 12:30am UTC](https://community.glideapps.com/t/image-component-label/73908/7 "2024-06-14T00:30:15Z")

</div>

This is not done with CSS, but with JavaScript, except for hover and styling the text.

> [@🎞️ 1. How to Create an Auto-Play Slideshow](https://community.glideapps.com/t/1-how-to-create-an-auto-play-slideshow/73271):
>
> Here’s how to create an autoplay slideshow with a duration based on the update interval of Glide (5-10 seconds), without using HTML or CSS: [ScreenRecording2024-05-11at13.34.01-ezgif.com-resize] Your image table must have a number column. You can use the “Find Element Index” column to generate row numbers based on RowId. See: [@Darren\_Murphy](https://community.glideapps.com/t/how-do-i-create-an-auto-incrementing-row-number-with-glide-tables/39572)’s method. Total Image: Use the “Roll Up” column to get the total number of images, which is useful for resetting the…
