Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[DataGrid] MUI datagrid filter popup causes horizontal scrolling and extends further from website limits on mobile #6143

Open
2 tasks done
maio4 opened this issue Sep 13, 2022 · 1 comment
Labels
component: data grid This is the name of the generic UI component, not the React module! feature: Filtering Related to the data grid Filtering feature feature: Rendering layout Related to the data grid Rendering engine

Comments

@maio4
Copy link

maio4 commented Sep 13, 2022

Duplicates

  • I have searched the existing issues

Latest version

  • I have tested the latest version

Current behavior 😯

When clicking on the filter button in the DataGrid , the popup doesn't adjust to the screen limits and causes horizontal scrolling.
This image represents this page: https://v4.mui.com/components/data-grid/filtering/
image

Expected behavior 🤔

I guess the expected behavior is some sort of wrapping of this component.

Steps to reproduce 🕹

Steps:

  1. Click on the filter button in the DataGrid on mobile

Context 🔦

No response

Your environment 🌎

No response

@maio4 maio4 added the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Sep 13, 2022
@flaviendelangle flaviendelangle transferred this issue from mui/material-ui Sep 13, 2022
@alexfauquette
Copy link
Member

Yes, the filter panel has a min-width. You can customize the filter panel CSS to override this behavior

Somewhat liked to the RFC #3719 About having a new design for filter panel

@DanailH DanailH added component: data grid This is the name of the generic UI component, not the React module! feature: Filtering Related to the data grid Filtering feature feature: Rendering layout Related to the data grid Rendering engine and removed status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels Sep 14, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: data grid This is the name of the generic UI component, not the React module! feature: Filtering Related to the data grid Filtering feature feature: Rendering layout Related to the data grid Rendering engine
Projects
None yet
Development

No branches or pull requests

3 participants