Support Article
Scroll bar disappears in Chrome browser v37
SA-1945
Summary
In Chrome browser, a business user launches their User Portal. Portal has navigation/Menu bar at the top with multiple Menus; each menu has sub menus (menu items).
Select a menu item from the menu bar to launch a harness. Harness (say HarnessA) loads on the portal with a verrical scroll bar as expected. Now, select another menu item from the menu bar and this launches a different Harness (say HarnessB). HarnessB displays as expected; this does not require a vertical scroll bar, so, vertical scroll does not display.
Now, click on the previous menu item and launch HarnessA. You will notice that, HarnessA no longer displays the vertical scroll bar and User unable to scroll through the content.
In IE, this issue does not reproduce; this Chrome only behavior.
Error Messages
No errors. Verical scroll bar does not display
Steps to Reproduce
1.In Chrome, launch a portal with a panel set of Header, Work Area, and footer.
2. Include a menu bar navigation in the header with two options, first an action to create work, the other option to launch a harness that replaces current.
3. Launch the portal in Chrome, navigate to the first menu option that creates work. notice there is a scroll bar.
4. Navigate to the second menu option that launches a harness, this does not require a scroll bar, so, the vertocal scroll does not display.
5. Navigate back to the first option that creates work. Notice the scroll bar disappears.
Root Cause
Turn on Developer Toolbar and select the harness. Noitce the styles for style class "DIV.harnessContent". You will notice the style as, overflow-y:hidden !important;
This is the root cause for the issue and you are not able to see the scroll bar on Y-axis (Vertical scroll bar)
Resolution
This issue is resolved through the following local change:
Create your own Style sheet (say MyStyles.css) and call this in the harness in question (here it is HarnessA) on 'Scripts and Styles' tab.
Write below code in MyStyles.css rule
DIV.harnessContent {
overflow-y:auto !important;
}
Delete your browser temp files and run your scenario.
Tags:
Published January 31, 2016 - Updated December 2, 2021
Have a question? Get answers now.
Visit the Collaboration Center to ask questions, engage in discussions, share ideas, and help others.