# How to make Gallery Image move Right on Hover

**URL:** <https://community.elfsight.com/t/how-to-make-gallery-image-move-right-on-hover/71396>\
**Category:** Platform Tips\
**Tags:** squarespace\
**Created:** [September 20, 2024, 12:10am UTC](https://community.elfsight.com/t/how-to-make-gallery-image-move-right-on-hover/71396 "2024-09-20T00:10:48Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![tuanphan](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/tuanphan/32/3165_2.png) [@tuanphan](https://community.elfsight.com/u/tuanphan)\
**Post date:** [September 20, 2024, 12:10am UTC](https://community.elfsight.com/t/how-to-make-gallery-image-move-right-on-hover/71396/1 "2024-09-20T00:10:48Z")

</div>

To make Gallery Image move right on hover on Squarespace, you can follow these steps.

**#1.** First, find [Gallery Section ID](https://community.elfsight.com/t/how-to-find-id-in-squarespace/65340).

In my example, it is:

```auto
section[data-section-id="66e9ea69d23c463c98a03892"]

```

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/2/6/26272ffe22c8b563f1f7770c00f9bf9914466a09.png)

**#2.** Next, use this code to Website Tools \> **Custom CSS**.

```auto
section[data-section-id="66e9ea69d23c463c98a03892"] figure:hover {
    transform: translateX(50px);
    transition: all 0.3s;
}
section[data-section-id="66e9ea69d23c463c98a03892"] figure {
    transition: all 0.3s;
}

```

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/d/a/dae7cfc87b591e513873b24d23c139bf5d0b0bd4.png)