Tab margin-top get assigned a strange value

[narnoneParticipant]

I have updated to the latest version.
When testing I found an issue I did not have before.
I have a tab that comes and goes based on screen height.
Basically if the screen height is two small, I split data between two tabs.
When the screen size is large enough, all data is displayed in one tab and the other has display set to none, disappears.

I found if the tab is set to none at the beginning and the page continues loading, the margin-top for the parent level of that tab is 26 and the child div that displays the text has a margin-top of -6. Resulting in the tab being below the other tabs when it appears.
If the tab is NOT set to none, and the page completes loading, the tab is visible and margin-top(s) are not set in either tag. The tab appears and disappears as it should.
Here is were I I get confused:
If I do not set the tab display to none until after the page is loaded, the margin-top is not set. The tab is not seen. The tab is displayed properly as the height of the page changes.
I did not have this issue with an older version.
Am I masking an issue, or is this the way it works?

[ivanpeevskiParticipant]

Hello narnone,

Thank you for reporting this behavior.
As a workaround solution, you can copy the margin-top from the first tab to the second tab when you show it.
Please have a look at the demo here: https://jsfiddle.net/xcqjr8my/1/
And a second working example, using media queries based on height (drag the window up and down to see the change): https://jsfiddle.net/xcqjr8my/2/

I also recommend using the addLast and removeAt methods to manipulate the tabs.

If you have any other questions, please do not hesitate to contact us again!
Best regards,
Ivan Peevski
jQWidgets Team
https://www.jqwidgets.com/

[Author]

Posts