This is a migrated thread and some comments may be shown as answers.

Gantt left side rows misaligned with right side

4 Answers 29 Views
Gantt
This is a migrated thread and some comments may be shown as answers.
Vedad
Top achievements
Rank 1
Iron
Veteran
Iron
Vedad asked on 04 Jun 2020, 11:47 AM

Hi, 

I think there is a bug on Gantt widget that occurs depending either on screen size/resolution or chrome zoom level. 

I got bug reported on my module which uses gantt widget. Client reported that on some of their screens rows on the left side are misaligned with rows on timeline.

After investigation, I managed to reproduce issue by scaling zoom on Chrome, to 90%. (they have bigger and probably better screens than mine, so it wasn't shown on my system). 

Same issue is reproducible on https://demos.telerik.com/kendo-ui/gantt/resources, if you resize gantt zoom to 90%. (I also attached image from demo)

I also looked though to find possible solution, and it seems that if we replace current fixed font-size: 14px, with font-size:1.5vh it seems to scale correctly.

Please could you take a look and suggest solution (I would prefer to avoid overriding native css of the widget).

Thank you and best regards,

Vedad

4 Answers, 1 is accepted

Sort by
0
Vedad
Top achievements
Rank 1
Iron
Veteran
Iron
answered on 04 Jun 2020, 11:50 AM

Sorry, but there is no edit post option, so I have to add another one.. (maybe to add option that user can edit its own posts).

Problem gets more obvious more data is loaded in gantt and as you scroll to the bottom.

0
Veselin Tsvetanov
Telerik team
answered on 08 Jun 2020, 08:25 AM

Hi Vedad,

The Kendo widgets rendering and styling are implemented and tested on the major browsers with the default zoom level (100%). I am afraid that changing the zoom level of the browser is not among the officially supported scenarios by the suite. Therefore, apart from keeping the default zoom level of the browser, I cannot think of a reliable workaround for the observed.

If the users insist on running the application in a zoomed browser, I would suggest you test the CSS approach that you have identified. Keep in mind, however, that it might not cover all possible cases in the scenario discussed.

Regards,
Veselin Tsvetanov
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
0
Vedad
Top achievements
Rank 1
Iron
Veteran
Iron
answered on 28 Jun 2020, 07:56 PM

Hi Veselin,

sorry for waiting on my answer, but I got engaged with other features that got higher priority.

Unfortunately, playing with CSS didn't resulted in consistent behaviour so I gave up on this and instructed users that 100% zoom is only reliable. For now it is accepted, but I would like to suggest to try to support different zooms due to accessibility. 

We have users who use (and specially during Covid-19 period) smaller laptop screens and simply, data is to crop in this view, so they are forced to zoom out.

Thank you for the help and stay safe.

 

0
Veselin Tsvetanov
Telerik team
answered on 30 Jun 2020, 10:41 AM

Hi Vedad,

Thank you for your suggestion. I have just opened the following feature request on your behalf:

https://feedback.telerik.com/kendo-jquery-ui/1474074-provide-support-for-different-zoom-levels-of-the-browsers

Please, cast your vote for the above, as that is how we measure the support among the community for a given feature.

Thank you again and stay safe.

Regards,
Veselin Tsvetanov
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
Tags
Gantt
Asked by
Vedad
Top achievements
Rank 1
Iron
Veteran
Iron
Answers by
Vedad
Top achievements
Rank 1
Iron
Veteran
Iron
Veselin Tsvetanov
Telerik team
Share this question
or