# Marquee CSS animation

**URL:** <https://community.weweb.io/t/marquee-css-animation/4630>\
**Category:** How do I?\
**Tags:** css, custom-css\
**Created:** [September 28, 2023, 7:36am UTC](https://community.weweb.io/t/marquee-css-animation/4630 "2023-09-28T07:36:02Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![FJP84](https://avatars.discourse-cdn.com/v4/letter/f/db5fbb/32.png) [@FJP84](https://community.weweb.io/u/FJP84)\
**Post date:** [September 28, 2023, 7:36am UTC](https://community.weweb.io/t/marquee-css-animation/4630/1 "2023-09-28T07:36:02Z")

</div>

Hi there,

I was trying to recreate below (Marquee in Webflow) in Webweb. I succeeded mostly, but in weweb the elements eventually are overlapping and the Infinity of the loop is not as smooth as in the video below. It stutters a bit so you can notice when it starts over.

I believe overlapping is caused because I am not able to correctly set the flex-shrink to zero, but thats an assumption.

Has anyone managed to create this kind of animation wit a bit of custom css but primarily by configure the elements in webweb itself?

[![](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/b/bc7658a9529b1ecef42ae39607f99c9ffabe6aad.jpeg "You Can't Find a Better Infinite Marquee") ](https://www.youtube.com/watch?v=ZMCNin2VjxU)

---

<div class="post-metadata">

**Author:** ![Joyce](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/joyce/32/13232_2.png) [@Joyce](https://community.weweb.io/u/Joyce)\
**Post date:** [September 29, 2023, 11:54am UTC](https://community.weweb.io/t/marquee-css-animation/4630/2 "2023-09-29T11:54:01Z")

</div>

Hi @FJP84 👋

Can you record a short video showing us how you set things up and what result you managed so far?

We released no-code animations in beta a couple of weeks ago so might be able to help you achieve that without any custom CSS.

---

<div class="post-metadata">

**Author:** ![GeovanyFerreira](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/geovanyferreira/32/13093_2.png) [@GeovanyFerreira](https://community.weweb.io/u/GeovanyFerreira)\
**Post date:** [September 29, 2023, 8:45pm UTC](https://community.weweb.io/t/marquee-css-animation/4630/3 "2023-09-29T20:45:32Z")

</div>

> [@FJP84](#):
>
> Hi there,
> 
> I was trying to recreate below (Marquee in Webflow) in Webweb. I succeeded mostly, but in weweb the elements eventually are overlapping and the Infinity of the loop is not as smooth as in the video below. It stutters a bit so you can notice when it starts over.
> 
> I believe overlapping is caused because I am not able to correctly set the flex-shrink to zero, but thats an assumption.
> 
> Has anyone managed to create this kind of animation wit a bit of custom css but primarily by configure the elements in webweb itself?

hi @FJP84  
I think you can do it this way

---

<div class="post-metadata">

**Author:** ![FJP84](https://avatars.discourse-cdn.com/v4/letter/f/db5fbb/32.png) [@FJP84](https://community.weweb.io/u/FJP84)\
**Post date:** [September 30, 2023, 8:54pm UTC](https://community.weweb.io/t/marquee-css-animation/4630/4 "2023-09-30T20:54:27Z")

</div>

Great approach