piyahub commented on issue #36370: URL: https://github.com/apache/superset/issues/36370#issuecomment-3636275448
Hello, could you please assign this issue (Fixing Table Header & Content Misalignment on Horizontal Scroll) to me. Problem: The table currently shows a noticeable misalignment between the column headers and data cells when scrolling to the far right. This affects readability and makes it difficult for users to correctly interpret the data. Root Cause (Likely) The header and body are scrolling separately, causing their positions to fall out of sync. Column widths aren’t uniformly applied, leading to small fractional pixel differences. Virtualization or dynamic rendering may be causing delayed or uneven layout updates, especially at extreme scroll positions. Proposed Fix Use one scroll container for both the header and body so they move together. Remove any independent scrolling applied to the header. Only the main table wrapper should scroll horizontally. Apply consistent column widths to both header and body cells to prevent auto-resizing differences. Switch to a fixed table layout so widths don’t change based on content. Prevent dynamic content shifts inside cells that could cause width recalculation. Enable the table's sticky header mode if using virtualization or a UI framework. Test at full scroll width in multiple browsers and correct any columns that still resize unevenly. Expected Result After applying these adjustments, the header and data cells will stay aligned throughout the entire scroll range. This will improve clarity, reduce visual glitches, and provide a more stable and professional table experience for users. If you liked my approach, please assign me this. Thank you. -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: [email protected] For queries about this service, please contact Infrastructure at: [email protected] --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
