I have a table, that is too wide for the screen and flows off the right.
I'd like it to scroll, horizontally but have not been able to make it do so.
I've added overflow-x: scroll to the table element, and a custom class, but no changes.
What's the secret to getting it to scroll to the right and left?
Hey, @Thomas Gooch
create your own CSS for vertical scroll or use the vertical scroll class on your table container.
on your screen widget tree, you have one = container - table - header row - row
So now you must create CSS (Example: scroll-vertical ) and use this class on your container properties. Style classes "scroll-vertical " are like this type.
then
.scroll-vertical {
overflow-y: hidden;
overflow-x: scroll;
height:100%;
width:600px;
}
try this I hope this was helpful for you
thanks
That's it- it wasn't in a container. Put it in a container and applied the class and it works.
Hi @Thomas Gooch ,
Have you tried the Scrollable Area widget? https://success.outsystems.com/documentation/11/building_apps/user_interface/patterns/using_mobile_and_reactive_patterns/interaction/scrollable_area/
Regards,
Bryan