You found a bug! We've classified it as a bug in our system. We encourage you to continue the discussion and to find an acceptable workaround while we work on a permanent fix.
  1. #11

  2. #12
    Ext JS Premium Member
    Join Date
    Apr 2011
    Posts
    13
    Vote Rating
    0
    dve is on a distinguished road

      0  

    Default


    It seems that both chrome and FF are dealing with box-sizing incorrectly. Its just that FF is more consistently incorrect.


    The W3C spec says that box-sizing applies to 'all elements that accept width or height'


    See this example: https://gist.github.com/2709126


    box-sizing seems have no effect on the table even though it has a border of 5px. Surprisingly only IE10 seems to render correctly.

  3. #13
    Sencha Premium Member seek's Avatar
    Join Date
    Sep 2008
    Location
    Italy
    Posts
    112
    Vote Rating
    1
    seek is on a distinguished road

      0  

    Default


    Try this, I HTH:

    PHP Code:
    Ext.grid.ColumnModel.override({
      
    getTotalWidth: function(includeHidden) {
          var 
    off 0;
          if(!
    Ext.isDefined(Ext.isChrome19)){
            
    Ext.isChrome19 = /\bchrome\/19\b/.test(navigator.userAgent.toLowerCase());
          };
          if (
    Ext.isChrome19){
              
    off 2;
          };
        if (!
    this.totalWidth) {
          
    this.totalWidth 0;
          for (var 
    0len this.config.lengthleni++) {
            if (
    includeHidden || !this.isHidden(i)) {
              
    this.totalWidth += this.getColumnWidth(i)+off;
            };
          };
        };
        return 
    this.totalWidth;
      }
    }); 

  4. #14
    Ext JS Premium Member
    Join Date
    Apr 2011
    Posts
    13
    Vote Rating
    0
    dve is on a distinguished road

      0  

    Default


    Thanks seek. I came up with an almost identical solution earlier.

    Code:
    Ext.chromeVersion = Ext.isChrome ? parseInt(( /chrome\/(\d{2})/ ).exec(navigator.userAgent.toLowerCase())[1],10) : NaN;
    
    
    Ext.override(Ext.grid.ColumnModel, {
    	getTotalWidth : function(includeHidden) {
    		if (!this.totalWidth) {
    			var boxsizeadj = (Ext.isChrome && Ext.chromeVersion > 18 ? 2 : 0);
    			this.totalWidth = 0;
    			for (var i = 0, len = this.config.length; i < len; i++) {
    				if (includeHidden || !this.isHidden(i)) {
    					this.totalWidth += (this.getColumnWidth(i) + boxsizeadj);
    				}
    			}
    		}
    		return this.totalWidth;
    	}
    });

  5. #15
    Ext JS Premium Member
    Join Date
    Sep 2011
    Posts
    62
    Vote Rating
    0
    ExtJSNinjas is on a distinguished road

      0  

    Default


    +1 thank you!

    Quote Originally Posted by seek View Post
    Try this, I HTH:

    PHP Code:
    Ext.grid.ColumnModel.override({
      
    getTotalWidth: function(includeHidden) {
          var 
    off 0;
          if(!
    Ext.isDefined(Ext.isChrome19)){
            
    Ext.isChrome19 = /\bchrome\/19\b/.test(navigator.userAgent.toLowerCase());
          };
          if (
    Ext.isChrome19){
              
    off 2;
          };
        if (!
    this.totalWidth) {
          
    this.totalWidth 0;
          for (var 
    0len this.config.lengthleni++) {
            if (
    includeHidden || !this.isHidden(i)) {
              
    this.totalWidth += this.getColumnWidth(i)+off;
            };
          };
        };
        return 
    this.totalWidth;
      }
    }); 

  6. #16
    Sencha - Community Support Team mankz's Avatar
    Join Date
    Nov 2007
    Location
    Stockholm, Sweden
    Posts
    2,711
    Vote Rating
    104
    mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all

      0  

    Default


    Bump, +1 for getting this resolved as it's now in the wild (affecting our users of Scheduler/Gantt 1.x).

  7. #17
    Ext JS Premium Member
    Join Date
    Apr 2008
    Posts
    352
    Vote Rating
    14
    rich02818 is on a distinguished road

      0  

    Default


    +1 also, we can't allow fielded systems to break due to lack of support...

  8. #18
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,868
    Vote Rating
    438
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    I see there is a new release of Chrome. I have not downloaded and tested. Hopefully this will fix things.

    Scott.

  9. #19
    Sencha User
    Join Date
    Jan 2011
    Posts
    544
    Vote Rating
    51
    willigogs is a jewel in the rough willigogs is a jewel in the rough willigogs is a jewel in the rough

      0  

    Default


    Awesome fix guys - much appreciated!

  10. #20
    Sencha User VDP's Avatar
    Join Date
    Feb 2012
    Location
    Boom, Belgium
    Posts
    82
    Vote Rating
    9
    VDP will become famous soon enough

      0  

    Default Awesome Fix

    Awesome Fix


    awesome fix! thanx!!

    Quote Originally Posted by seek View Post
    Try this, I HTH:

    PHP Code:
    Ext.grid.ColumnModel.override({
      
    getTotalWidth: function(includeHidden) {
          var 
    off 0;
          if(!
    Ext.isDefined(Ext.isChrome19)){
            
    Ext.isChrome19 = /\bchrome\/19\b/.test(navigator.userAgent.toLowerCase());
          };
          if (
    Ext.isChrome19){
              
    off 2;
          };
        if (!
    this.totalWidth) {
          
    this.totalWidth 0;
          for (var 
    0len this.config.lengthleni++) {
            if (
    includeHidden || !this.isHidden(i)) {
              
    this.totalWidth += this.getColumnWidth(i)+off;
            };
          };
        };
        return 
    this.totalWidth;
      }
    });