Streaming live at 10am (PST)

Strange float behavior


#1

@waldo has anyone ever experienced this type of float behavior?

https://preview.webflow.com/preview/royaltyexoticcars?preview=992c99b865e20009decdc43f4e2d8149


#2

Hello @thewonglv

Just change to flex box on Dynamic list wrapper and set the porcentaje to the amount of elements that you would want to show on that row, in this case 25% or less if you wanna add some padding.

Let me know if that helps.


#3

I used to use flexbox but there are some bugs with dyn lists and 3d transforms :frowning: maybe I will try again. But this float behavior is still strange nonetheless.

Also, the floats work as expected in the Designer. Hard to pin down the cause of this


#4

@thewonglv from what I'm seeing it's all rendering correctly for me on this end, the usual fix for it is to set a min-height on the elements you're floating (looks like a min-height of 300px on your .cars__dynitem class does the trick).

I was only able to reproduce it in Firefox (looks like Chrome and Safari were floating nicely), here's a GIF showing what I was doing in Firefox Inspector: https://cl.ly/j07z

I'm investigating whether this is expected behavior or a bug, I'll keep you posted, thanks man!


#5

Any update on this float stuff. trying to understand why it's behaving like this. seems like the min-height trick is a bit of a workaround - looking to understand the issue more deeply.


#6

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.