Streaming live at 10am (PST)

Absolute position not populating in Collection list


#1

Hi there,

I have a question regarding the absolute position mode used within collection list.
I have setup an “avatar” to be absolute positioned on my layout, it works fine on mobile version but on desktop and tablet, the same avatar is not populated in the collection items, only the first one is populated… any idea ?

Please see attached the screenshot:
Read-only link: https://preview.webflow.com/preview/tlhsierre?preview=c7f1d22b5d43694cddeb46ddd4fd9856

Here is my public share link: LINK
(how to access public share link)


#2

I have resolved my problem.

I used relatibe positioning instead, it did the trick.
Thank you and sorry for disturbing for nothing :slight_smile:


#3

For it to work with absolute, your wrapper element must be position:relaitve, to become the reference for the absolute element. If you don’t do that, all your avatars are going to pile up somwehere close to their closest positioned parent.


#4

That is exactely what happened !
Thank you very much for the explanations and the helpful link, really appreciate :slight_smile:


#5

You’re very welcome.

Mastering absolute positioning is the key to achieve whatever you want to create and keep it simple and solid. It’s often overlooked how it really works.


#6

Thanky alot again @vincent
I now used the technic to place little icons around some event thumbnails and it works perfectly well !

:blush: