21
Views
2
Comments
Solved
Reactive Tab Navigation - Header Items disappear
Question

Good morning, I'm working on a page that will use tab navigation to route users to different content sections.   One of the sections is a rather large table that contains a horizontal scroll.   What I'm seeing is when I select that tab the content is displayed as expected, but the vertical navigation tabs disappear and there is no way to navigate to another section.

If I place my table/scroll in a DIV and set the width in pixels it will render without losing my navigation tabs, but I don't love this solution because not all end users are set to the same resolution.

Has anyone else experienced this, and if so do you have a work around?

TabNavigation.oml

Rank: #982
Solution

Hi Josh,


It took me a while to figure it out but I think I found the offending element.
I believe it is the 'white-space: nowrap' in the.table style definition.

Look what I did here to fix the issue by applying an overriding style on the screen itself that is added to the styles of the Table widget.