Skip to content

[Bug]: Column Overflow Issue in Fixed Column Table #1272

Open
@hoahai

Description

@hoahai

Is there an existing issue for this?

  • I have searched the existing issues

Current Behavior

In a table with fixed columns, when scrolling horizontally, text from other columns overlays on top of the fixed columns, causing readability issues. Additionally, applying background color to rows solves the overlay issue for the row contents but does not affect the header. The background color fix for rows also fails when a row is selected or hovered.

Current Behavior

  • Text from scrollable columns overlays on fixed columns.
  • Row background workaround fails to apply to the header and does not work reliably on row selection or hover.
image

Expected Behavior

  • Fixed columns should retain a consistent background that prevents text overlay from scrollable columns.
  • Background color should apply to both rows and header consistently, regardless of selection or hover states.

Steps to reproduce

  1. Create a table with fixed columns and some scrollable columns.
  2. Add data with both active and inactive states to observe background color application.
  3. Scroll horizontally to observe the overlay issue.

Environment

OS: MacOs
Browser: Google Chrome

Additional Information

No response

Activity

moved this to 🆕 New in Lowcoderon Nov 12, 2024
adnanqaops

adnanqaops commented on Dec 11, 2024

@adnanqaops
Collaborator
  1. Text Overlay issue has been resolved.
  2. Background color should apply to both rows and header consistently, regardless of selection or hover states. --> This is not working fine. Background color is not applied to Selection or Hover States. and Selection or Hover State color is not customisable as well. It remains set to default settings.
Screenshot 2024-12-11 at 2 57 07 PM
hoahai

hoahai commented on Dec 11, 2024

@hoahai
Author

@adnanqaops for #1, if the Name Column is set as "Fixed", it should be on top of the Date Column instead being scaled down in width
As you can see in the screenshot, some text in Date columns (Both header and row) is showing in the Name Column instead of being hidden under the Name Column
image

adnanqaops

adnanqaops commented on Mar 24, 2025

@adnanqaops
Collaborator

@iamfaran , here's the App with demo of the issue :

V2.6.4.json

added a commit that references this issue on Mar 25, 2025

Merge pull request #1597 from iamfaran/fix/table-overlap-1272

047a9f1
prinskarnatie

prinskarnatie commented on Mar 27, 2025

@prinskarnatie

There is 1 remaining issue. If multi select is enabled (shown as the first column), horizontal grid lines disappear on some of the rows.

Image

In the screenshot all the columns except for the last one is fixed.

adnanqaops

adnanqaops commented on Apr 3, 2025

@adnanqaops
Collaborator

@iamfaran , this issue still exist when

  1. Horizontally scrolling while hovering over a Table Row.
  2. Horizontally scrolling while a Table Row is selected.
Image

So, I won't be closing this ticket as of now. and we will fix this issue in the next Release.

2 remaining items

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

ComponentsDedicated to Frontend Visual ComponentsJavascript FrontendPull requests that update Javascript code

Type

Projects

Status

🏗 In progress

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions

    [Bug]: Column Overflow Issue in Fixed Column Table · Issue #1272 · lowcoder-org/lowcoder