I am running into a major issue with items not retaining their formatting when previewing or publishing to HTML.

I have incorporated 2 screenshots that show this very distinctly, and I have not been able to find any way to correct the issue.

If you look at the layout in ForeUI the icon text is centered and the tab text is left aligned:

When published the icon text literally floats randomly and changes from launch to launch, and the tab text shifts completely to the right:

Is this a known issue, and if so is there a fix/workaround?


2 answers

I think the reason is that you use HTML tags in the tab.

Using HTML tags in tabs are not officially support yet, and it cause problem in the simulation. The workaround for now is not to use HTML tags in tab. If you need the bold text, you can use some fonts like “Arial Black” to get the similar result.


I originally built it without the HTML tags in the tabs and it produces the exact same effect. The entire tab text is still shifting.

That also doesn’t address why the text labels for the icons is moving all over the place. I have deleted them, recreated them, and tried all different combinations of aligning them, but it still gives the same result as well. It’s nearly impossible to tell what final output alignment I am going to get with these fields.

  1. Maybe you can try to remove any unused white characters in your tab text. The Vertical Tabs element is designed to move the text of selected tab aside to indicate that tab is selected, so if you have some invisible characters in your tab text, it could affect the measurement of text width.

This question is now closed