How to add scrollbar to the repeating dynamic layout in a section

User Experience
, , , ,
1

hi team,

There is a long chain of email which has to be shown and need to put a scroller so that the full conversation can be traversed by the customer. The email trail is in a repeating dynamic layout.

Have tried below steps but there is no luck

Specified the max height as 1000 px in presentation tab of RDL, gave - overflow-x:scroll in the CSS but no luck. PFA for references

Kindly suggest!

Thanks

email trail_0.png
email trail_0.png547×649 20.2 KB

Scrollbar_0.png
Scrollbar_0.png613×572 17.4 KB

2

@ritikap3 Please add custom css class in style sheet and refer in the layout. Please try to change the different display option.

.CustomeScroll {
display: inline-flex;
overflow-x: auto;
}

3

Hi @Nadimuthu T,

I tried the way you suggested but it doesn’t work still. PFA for reference

Also, the class which is created in css file - .CustomControl. I cannot find it by clicking on helper classes. Am i missing some configuration for it. Kindly suggest

Thanks,

CSS file change.png

RDLConfiguration.png
RDLConfiguration.png681×632 23 KB

Helperclass.png
Helperclass.png1185×596 33.2 KB

4

@ritikap3 I am able to achieve it without custom css also. Please see the screen shot. Please verify any other css over ride in the application

RDL Config.jpg
RDL Config.jpg673×617 41.6 KB
RDL Screen.jpg
RDL Screen.jpg1491×776 47.4 KB

5

Hi @Nadimuthu T,

The scrollbar I am able to achieve by setting the max height and giving overflow-y-auto setting, previously it didn’t work but now its coming. Thanks!

6

@ritikap3 can you please post the screenshots of your code changes? Would be helpful for others.