Question
Intel Corporation
US
Last activity: 8 Jan 2018 9:04 EST
Scroll Bar appears when using a Tab group.
I am using Tab group in my Portal.
I can see a scroll bar even though I have Content that fits the screen. This only happens when I use Tab layout.
Once we scroll down, tab disappears and users are not able to see the Home tab. They have to scroll to the top to see the Home tab.
Accepted Solution
Intel Corporation
US
Thank you.. I have tried the same but it didn't work.
I have changed the portal layout to match the Case Worker Layout. That solved my issue.
Pegasystems Inc.
IN
Try using position:fixed in the css to see if you can make the header section fixed.
Other way to debug is to run IE debugger and inspect the elements and see what is causing the scrollbar to come and why the header is not getting fixed.
Accepted Solution
Intel Corporation
US
Thank you.. I have tried the same but it didn't work.
I have changed the portal layout to match the Case Worker Layout. That solved my issue.
Perficient Inc - New York
US
Could you elaborate what you mean by "changing the portal layout to match the Case Worker Layout"? I have the exact same issue, and I can't find a way to fix this.. I would really appreciate it. Thanks.
Perficient Inc - New York
US
Could someone explain how I could keep the tab group layout and get rid of the scrollbar?
Right now, it is causing my application to have two vertical scrollbars next to each other, which isn't user friendly as shown in the snip.
I've tried adding js scripts and css styles at both the application skin and harness levels, but they don't remove the outer scrollbar.
I'm wondering if it's a bug and I have to create a SR for this.
Thanks,
Pegasystems Inc.
IN
Hello Jimin,
As per screen shot shared I didn't see any vertical scroll bars . Can you please share the screen shot ,added scripts and css styles.
Thanks & Regards,
Durga
Pegasystems Inc.
IN
Hi,
Please try inspecting(Developer tools- F12) the outer vertical scroll bar to observe from where exactly the scroll is from. Identify the div's and add an overflow: hidden!important style in UserWorkForm rule.
Let me know if you have any queries.
Best Regards,
Mounika
Perficient Inc - New York
US
The two vertical scroll bars are present in the screenshot I provided.
I managed to fix it by inspecting the developer tool and setting its overflow to none.
Thanks!