I am working on an Angular project. I have this table, which I build but I don't know in advance how big the font should be. Because of that i created this function (this is the code i have inside of it): 

```
$('.td').css({
    'font-size': Number(this.f) + 'px'
});

//Mobile
  $('.mobileTdLong').css({
      'width': Number(this.f) + 150 + 'px'
  });

  $('.mobileTdShort').css({
    'width': Number(this.f) + 40 + 'px'
  });

//Desktop
  $('.tableDesktopShort').css({
    'width': Number(this.f) + 100 + 'px'
  });

```

NOTE: f is a variable from user input.

The code I have written isn't the best one for my problem because it doesn't permenantly change my table font.. It just flickers (from `20px` which is set by default in .css file, to this.f value). The reason I need this is because every 10 seconds the table values are refreshed.

I hope I provided enough information. 
Thanks