Skip to main content

In classic a tab page with the Lightning Design theme has a left/right scroll bar at bottom as soon as the page opens as seen here:


In Lightning the same tab page when opened, there is no left/right scroll bar at bottom as seen here:

!(https://us.v-cdn.net/6032350/uploads/attachments/RackMultipart20180410-83598-rk4x58-Lightning_Design_theme_tab_in_Lightning 1 inline.PNG “Image https//d2r1vs3d9006apcloudfrontnet/s3_images/1723826/RackMultipart20180410-83598-rk4x58-Lightning_Design_theme_tab_in_Lightning__1__inlinePNG1523366517”)


If you scroll all the way down to the bottom of the page, a very tiny bar appears but it is very difficult to see and use.

!(https://us.v-cdn.net/6032350/uploads/attachments/RackMultipart20180410-57547-3b0teq-Lightning_Design_theme_tab_in_Lightning 2 inline.PNG “Image: https://d2r1vs3d9006ap.cloudfront.net/s3\_images/1723827/RackMultipart20180410-57547-3b0teq-Lightning\_Design\_theme\_tab\_in\_Lightning\_\_2\_\_inline.PNG?1523366526”)


Is this something that can be fixed int he Lightning Design theme?

Hey Daniel,

What’s worked for me is placing the skuid page components in a wrapper so that I can control the overflow of the page. Or you might want to apply a general height calculation to your page so that the scroll bar is moved up slightly. Something like {height: calc(100vh - 600px)} might work for you. 

In our Lightning development I’ve noticed that tables tend to span outside of the Lightning component. 



The table in a wrapper worked perfectly. Thank you Josef.


How do you control the overflow?  I have a table that expands far beyond the screen in classic.  In classic, the horizontal page scroll bars automatically show up at the bottom so it isn’t an issue.  I need to make it work the same way in Lightning.