Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
70
Table header not padding to the right when scroll bar appears
posted

Hi Team,

igGrid seems to have the capability of including the padding-right on the table header when there is a scroll bar in the table body. This seems to work fine in case of local data source as below-

https://jsfiddle.net/zs4gjd16/

But the issue comes when there is a remote URL acting as a data source. Then even if there is a scroll bar present in the table body, it is not adding padding-right to the table header as below-

https://jsfiddle.net/xjy1nv9f/1/

This issue is causing to misalign the table header cells with the table body cells, as the table header cells are a bit more stretched in width as compared to cells in table body with the scroll bar. Although this misalignment is not quite visible in the above example, it is really significant in our production app.

Please let me know how this issue can be fixed.

Regards,

Vaibhav

Parents
No Data
Reply
  • 640
    Verified Answer
    Offline posted

    Hello Vaibhav,

    Thank you for your patience while I was looking into this matter for you.

    After an investigation I found that this issue is not related to the remote data source. The reason for this behavior is that in the second sample the width the Grid control is defined with its initialization to 100% and the width of its column are not set. What you can do is to set all column widths so that their sum becomes 100% or you can set the Grid's width after its rendering. Another option is to not set the width at all like in the first of the provided samples.

    I have modified the second sample illustrating my suggestions. Please test it on your side and let me know whether you find it helpful.

    Looking forward to hearing from you.

    Regards,
    Viktor Kombov
    Entry Level Software Developer
    Infragistics, Inc.

Children