What's New?

[CLOSED] [#72] Title in Tab panel truncated in IE8 for ver2.1

Page 1 of 2 12 LastLast
  1. #1
    Jul 20, 2012, 11:25 AM

    [CLOSED] [#72] Title in Tab panel truncated in IE8 for ver2.1

    While testing v2.1, the titles in the tab panel are truncated in IE8, as below:
    Click image for larger version.  Name: problem_tab_title_ie8.JPG  Views: 207  Size: 39.6 KB  ID: 4513


    However using v2.0 the titles shown correctly like below:
    Click image for larger version.  Name: OK_tab_title_ie8.JPG  Views: 156  Size: 37.3 KB  ID: 4514


    This won't happen for both v.20 and v.21 in Chrome, but sadly I don't have a choice as the default company browser is IE8. Is there a fix for that? Should I report this to ExtJS?
    Last edited by Daniil; Sep 30, 2013 at 3:55 PM. Reason: [CLOSED]
  2. #2
    Jul 20, 2012, 1:36 PM
    Hi,

    Could you provide a sample? I am unable to reproduce with my test case.
  3. #3
    Jul 20, 2012, 1:52 PM
    Thanks for the reply.

    Here is the code that can reproduce the problem in my machine. Please remember it is on IE8. I'm just worry it is the IE8 that has some link to the screen resolution that mislead the calculations of the width of the labels.... anyway the strange thing is it does not happen in v2.0

    <%@ Page Language="C#"  %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
       <ext:TabPanel id="TabPanel2" layout="FitLayout" runat="server" activetabindex="0" border="false">
   
                     <Items>

                      <ext:Panel   ID="pnlClientProfile" runat="server" Title="Client Profile" BodyPadding="5"  AutoScroll="true"  >
                  
                           
                     </ext:Panel>
                         <ext:Panel ID="pnlSAA" runat="server" Title="Strategic Asset Allocation" Layout="VBoxLayout" Icon="Cog">
                          </ext:Panel>
                             
                                
                          
                          <ext:Panel ID="pnlInvestment" runat="server" Title="Wealth Review"   Layout="FitLayout" Icon="Cog">
                           
                         </ext:Panel>
                            <ext:Panel ID="pnlPortAnalysis" runat="server" Title="Portfolio Review" Layout="FitLayout">
                      
                         </ext:Panel>


                          <ext:Panel ID="pnlPortForecast" runat="server" Title="Portfolio Forecast" Layout="FitLayout">
                        
                         </ext:Panel>


                         <ext:Panel ID="pnlReport" runat="server"    Title="Report"   >
                              
                         </ext:Panel>
                    
                     
                     </Items>
                 </ext:tabpanel>
    </form>
</body>
</html>
  4. #4
    Jul 20, 2012, 2:20 PM
    I tested your sample under IE8 (XP SP3) and cannot reproduce the issue
  5. #5
    Jul 20, 2012, 2:32 PM
    I am unable to reproduce as well in IE9 in all modes and IETester.

    Please ensure the compatibility mode is switched off.
    Last edited by Daniil; Jul 20, 2012 at 2:41 PM.
  6. #6
    Jul 20, 2012, 3:10 PM
    Yes I've tested with different compatibility and problem persist.

    And I've find more information about it. It is related to the Zoom scale in IE8. If you use CTRL+ or CTRL- or CTRL while scoring the middle mouse wheel, which change the Zoom scale, some of the zoom percentage shows the labels without truncation and some do.

    However I've tested with v2.0, and, doesn't matter what zoom scale you use, it does display correctly.
  7. #7
    Jul 20, 2012, 3:48 PM
    Try to use
    .x-ie8 .x-tab BUTTON .x-tab-inner{
            text-overflow: clip;
        }
    I guess it is required to report Sencha about the issue
  8. #8
    Jul 20, 2012, 5:15 PM
    I have reported to Sencha.
    http://www.sencha.com/forum/showthread.php?231526
  9. #9
    Jul 23, 2012, 7:33 AM
    Thanks that 

      .x-ie8 .x-tab BUTTON .x-tab-inner{
            text-overflow: clip;
        }
    works perfectly :)
  10. #10
    Jul 23, 2012, 8:12 AM
    Yes, please use the Vladimir's fix for now.

    Sencha has opened a bug ticket. So, when it will be fixed, you could remove that fix.

    I will monitor.
Page 1 of 2 12 LastLast

Similar Threads

  1. [CLOSED] Toolbar on panel title
    By jeybonnet in forum 1.x Legacy Premium Help
    Replies: 5
    Last Post: Apr 07, 2011, 3:05 PM
  2. [CLOSED] Collapsed Panel Title
    By randy85253 in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Apr 27, 2009, 1:03 PM
  3. Combobox in GP - width truncated
    By Tbaseflug in forum 1.x Help
    Replies: 3
    Last Post: Jan 21, 2009, 3:46 PM
  4. Panel - Collapsed Title?
    By Tbaseflug in forum 1.x Help
    Replies: 5
    Last Post: Jan 21, 2009, 9:35 AM
  5. [CLOSED] Panel Footer title
    By sz_146 in forum 1.x Help
    Replies: 3
    Last Post: Dec 02, 2008, 11:10 AM

Tags for this Thread

Posting Permissions