Question
Layout Group Spacing issue
Team,
We have a issue with Layout group spacing.
When the number of Tabs(10-12) are greater than the browser or screen width, the Tab Navigator displays. Using the Tab Navigator to switch between different tabs results in a white space on the Tab which increases when multiple tabs are switched.
lets assume 1st item is selected and then we click the right arrow to see the other items, when the first item is not being displayed then we see a space being added below the items.
This can also be seen in OOTB Layout groups.
We have had discussion with the support team and they suggest to reach out to the collaboration team.
please guide.
***Moderator Edit-Vidyaranjan: Updated Platform Capability, Converted Discussion to Question***
Hi Ayan,
I understand that the number of tabs should be limited to 6 but in this case the business requirement is such.
I tried 'Enable stretch for tabs' option under the Layout Group Tab but this does not help the cause. It truncates the tab value and also some of the tabs appear below the table. pfa screenshot for your reference.
please let me know if there is any other possible solution for this.
Thanks,
Manoj
Hi Manoj,
Can you share the instance details for us to check ?
It seems stretched tabs is not working properly.
Hi Manoj,
First of all, it is always recomended to keep tab limit max upto 6-8 for better screen rendering performance if you are using layout group.
Previously in v7.1/2 we often use tab group layout but its now depricated.
Secondly, to resolve your issue, please select "Enable stretch for tabs" in the layout group" and modify/override the component style in the skin rule.
To navigate, Component style -> Layout groups -> Tab (under inherited/My format tab) -> Change the style under "Tab" header.
Please do the changes and let me know if the issue still exist. But please follow the recomendation during the screen design going forward.
Regards,
-Ayan