Hi all,
I have a flex repeater in a flex container that I would like to grow to avoid the number of instances causing scroll bars on the side. Hopefully the below image will help explain what I mean if that doesn’t make sense!
I basically want to avoid the scroll bars highlighted in red by allowing the flex repeater to expand to roughly where the blue line is.
Is there a simple way to do this rather than have to use a script to calculate the repeaters height as I want to try to avoid issues with users resizing the page?
Try setting position.basis of the repeater itself to 100%, instead of a fixed pixel value.
1 Like
Wow thanks for the quick response!
Well it kind of works but it doesn’t seem to stop where I would expect it to (after the bottom of the last instance)
Instead it takes up what I would asume is 100% of the default height of the parent object in this case 800.
Ah, not a web developer by any means. Maybe auto or content or max-content? https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis
I use auto on the basis for anything that needs to fill only the space required
grow: 0
shrink: 0
basis: auto
and if that doesn’t quite look right set grow and shrink to 1.
1 Like
basis = auto was the trick!
Thank you all!
1 Like
