Hi there,

we are using version 6.3.11 and notice a bug in the tab control display in IE. When a tab page inside a control has spaces in the name e.g."My Tab first" some wierd clipping happens in IE. also like there is some logic that cuts it after the first space and it would display something like "My". The workaround (which is actually not very good visually because there is still some ugly clipping) is to add two additional spaces at the end so "My Tab first  ". All works fine in FF but in IE even with this workaround it still displays pretty rough / ugly since the padding is all messed up as well as some weird spacing between the tabs

Thanks,

Daniel

For anyone else suffering from this annoying bug (when using tab names that have spaces in them IE doesn't render them properly, being cut off and weird spaces between tabs).

To fix this:

- override tabcontrol.xslt. find the tag below and add a float:left to the tab label div for the nobr and span tags. See bolded below.

<div class="Common-FontData TabControl-LabelPadding TabControl-Label" dir="{$dir}"  onkeydown="mobjApp.TabControl_KeyDown('{@Id}',window,event)"  style="float:left;" >
                          <xsl:if test="@Id=../@Attr.Selected">
                            <xsl:attribute name="tabindex">
                              <xsl:value-of select="@Attr.TabIndex" />
                            </xsl:attribute>
                            <xsl:attribute name="vwgfocus">
                              <xsl:value-of select="1" />
                            </xsl:attribute>
                          </xsl:if>
                          <nobr style="float:left;">
                            <xsl:if test="@Attr.Image">
                              <img id="IMG_{@Id}" src="{@Attr.Image}" height="16px" width="16px" align="absmiddle"/>&#160;
                            </xsl:if>
                            <span id="TXT_{@Id}" style="float:left;"><xsl:value-of select="@Attr.Text" /></span>&#160;
                          </nobr>
                        </div>
                        <div class="TabControl-Right"  style="float:left;">&#160;</div>
                      </div>