# How to Fit Image in Repeater

**URL:** <https://forum.wixstudio.com/t/how-to-fit-image-in-repeater/60029>\
**Category:** Ask the community\
**Tags:** question, wix-studio\
**Created:** [June 18, 2024, 7:02am UTC](https://forum.wixstudio.com/t/how-to-fit-image-in-repeater/60029 "2024-06-18T07:02:26Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![karr](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/karr/32/38094_2.png) [@karr](https://forum.wixstudio.com/u/karr)\
**Post date:** [June 18, 2024, 7:02am UTC](https://forum.wixstudio.com/t/how-to-fit-image-in-repeater/60029/1 "2024-06-18T07:02:26Z")

</div>

**Question:**  
How can I make an image fit into its container in a repeater?

**Product:**  
Wix Studio Editor

**What are you trying to achieve:**  
I need images to fit into their container in a repeater. Currently, they are cut and don’t show the entire content.

**What have you already tried:**  
I tried the CSS object-fit property and it didn’t help.

**Additional information:**  
The first screenshot shows the image being cut.

 ![wix-image-fit](https://us1.discourse-cdn.com/wix/original/3X/f/3/f3975cdbb93ffd6431189ea0ea9da307ccf12ce7.jpeg)

The second screenshot shows the image fitting into its container with the built-in event list component.

 ![wix-image-fit-2](https://us1.discourse-cdn.com/wix/original/3X/b/f/bf2ab5dbd03b0f0b0e532e5bd87d15b26620ae1a.jpeg)

UPDATE:  
Also, there are no options for the image element that seem to meet this need:

 ![wix-image-fit-3](https://us1.discourse-cdn.com/wix/original/3X/5/6/565671d308a04503fb0072a4724dcfff1724152c.jpeg)

 ![wix-image-fit-4](https://us1.discourse-cdn.com/wix/original/3X/a/3/a371789777fd3ee301447f655a94d29aac944c4c.jpeg)

---

<div class="post-metadata">

**Author:** ![loeiks](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/loeiks/32/109570_2.png) [@loeiks](https://forum.wixstudio.com/u/loeiks)\
**Post date:** [June 18, 2024, 11:45am UTC](https://forum.wixstudio.com/t/how-to-fit-image-in-repeater/60029/2 "2024-06-18T11:45:27Z")

</div>

In image settings you should have options like “fill”, “cover” etc. I don’t know if you tried them but they should fix it. I don’t mean the CSS editing, I’m referring to settings panel of images. (edit the first item’s image in the repeater)

Kolay gelsin.

---

<div class="post-metadata">

**Author:** ![Pratham](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/pratham/32/119586_2.png) [@Pratham](https://forum.wixstudio.com/u/Pratham)\
**Post date:** [June 18, 2024, 2:17pm UTC](https://forum.wixstudio.com/t/how-to-fit-image-in-repeater/60029/3 "2024-06-18T14:17:08Z")

</div>

There is currently no way to directly change the image fit mode through the editor.  
However you can do this using the **[Fit Mode](https://dev.wix.com/docs/velo/api-reference/$w/image/fit-mode)** property in Velo.

---

<div class="post-metadata">

**Author:** ![karr](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/karr/32/38094_2.png) [@karr](https://forum.wixstudio.com/u/karr)\
**Post date:** [June 18, 2024, 8:10pm UTC](https://forum.wixstudio.com/t/how-to-fit-image-in-repeater/60029/4 "2024-06-18T20:10:44Z")

</div>

Hi loeiks,

There are no options like fill or cover for the image element in the repeater. I’ve updated my question to add screenshots about that.

Teşekkürler =)

---

<div class="post-metadata">

**Author:** ![loeiks](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/loeiks/32/109570_2.png) [@loeiks](https://forum.wixstudio.com/u/loeiks)\
**Post date:** [June 18, 2024, 9:03pm UTC](https://forum.wixstudio.com/t/how-to-fit-image-in-repeater/60029/5 "2024-06-18T21:03:32Z")

</div>

All native images have this feature so even if you don’t see that you can use that feature via code add this line of code in your page to change the behavior for all images in that page:

```js
$w("Image").fitMode = "fixedWidth";

```

The code above will effect all images and it may not the thing you are looking for so I’m not sure you can also replace “fixedWidth” from the options below:

- fixedWidth
- fit (this might be what you need)
- fill

So try them and see if it’s working. Normally you should have these options in the settings panel of image element interesting that you don’t see them somehow…

---

<div class="post-metadata">

**Author:** ![karr](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/karr/32/38094_2.png) [@karr](https://forum.wixstudio.com/u/karr)\
**Post date:** [June 19, 2024, 5:33am UTC](https://forum.wixstudio.com/t/how-to-fit-image-in-repeater/60029/6 "2024-06-19T05:33:33Z")

</div>

Hi @Pratham and @loeiks,

Thank you both, it worked!

The entire code:

```javascript
function filterDataset(startDate, endDate) {
    // Check if startDate and endDate are valid dates
    if (startDate && endDate) {
        // Filter dataset based on start date on or after the selected date
        $w("#datasetEvents").setFilter(wixData.filter()
            .ge("start", startDate) // "ge" means greater than or equal to
            .le("start", endDate) // "le" means less than or equal to
            .eq("status", 'SCHEDULED')
        )
        .then(() => {
            if ($w("#datasetEvents").getTotalCount() === 0) {
                // Dataset is empty
                $w('#sectionEvents').collapse();
            }
            else {
                // Dataset has data
                $w('#sectionEvents').expand();
            }
        })
        .then(() => {
            $w("#repeaterToday").onItemReady(($item, itemData) => {
                // Get the image element within the repeater item
                const image = $item("#imageToday");
                // Set the fit mode of the image to "fit"
                image.fitMode = "fit";
            });            
        })
        .catch((err) => {
            console.error("Error applying filter:", err);
        });
    } else {
        console.error("Invalid startDate or endDate:", startDate, endDate);
    }
}

```

Now the images look like this:

 ![wix-image-fit-5](https://us1.discourse-cdn.com/wix/original/3X/0/3/033c5dfd489ef343a9f22ac84d796e5085914204.jpeg)