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

2 Bugs when zooming a grid

1 Answer 181 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Thomas
Top achievements
Rank 1
Thomas asked on 31 Oct 2012, 02:59 PM
I found two minor ui glitches that appear when zooming a page that contains a grid:

1) Grid header and grid body are not well aligned when zooming a page that contains a grid. The border line of some column headers is not well aligned with the border line of the respective column in the body. The effect becomes more visible the higher the zooming level is. All the columns become well aligned again once any column has been resized. After resizing a column the effect can|t be reproduced anymore (until the page is reloaded).

2) Resizing cursor does appear when zoomed page is scrolled to the right. Please notice, I'm referring to the horizontal scrollbar of the browser window, not to the scrollbar of the grid. The resizing cursor is always available (for any column) as long as the scrollbar is on the leftmost position. Once the user scrolls to the right (even a little bit), the resizing cursor doesn't appear anymore for any column. This can also be reproduced in low zoom levels, when the horizontal scrollbar just appears. In this case there seems to be some kind of threshold, when scrolling a little bit to the right, the resizing cursor is still available, scrolling a little further, no resizing cursor.

Both issues can be reproduced in the online demos (e.g. column-resizing.html), but also in 2012 Q2 and 2012 Q3 Beta. As both problems appear in various browsers (Firefox 16, Chrome 22, in IE7-9 only the 2nd bug) I suspect these could be a problem in kendoUI.

1 Answer, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 31 Oct 2012, 04:27 PM
Hi Thomas,

Indeed, both issues are related to the Kendo UI Grid, but they are also caused by a combination of reasons.

The column misalignment is caused by the fact that the scrollbars on the page are not zoomed proportionately to the other content. You can avoid this by disabling Grid scrolling.

The column resizer problem is caused by the fact that jQuery position calculations don't work correctly when the page is zoomed. Although this is theoretically possible to fix, the development effort and changes that we need to make do not correspond to the severity of the problem. If you will be targeting users with impaired vision, I would suggest setting a larger font-size, which will remove the need to zoom the page. Another alternative is to add a widget that can change the page font-size on the fly, depending on user preferences.

Greetings,
Dimo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Grid
Asked by
Thomas
Top achievements
Rank 1
Answers by
Dimo
Telerik team
Share this question
or