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

[data grid] - Wrong cell content alignment and position when using a custom renderCell function #12347

Closed
TiagoPortfolio opened this issue Mar 6, 2024 · 2 comments
Labels
component: data grid This is the name of the generic UI component, not the React module! support: commercial Support request from paid users

Comments

@TiagoPortfolio
Copy link
Contributor

TiagoPortfolio commented Mar 6, 2024

The problem in depth

After upgrading @mui/x-data-grid to version "7.0.0-beta.4", all the content of the cells of my columns using a custom renderCell function is either not aligned at the center or the position of the elements is completely different.
For instance:

BEFORE AFTER
Screenshot 2024-03-06 at 10 44 29 Screenshot 2024-03-06 at 10 44 34
Screenshot 2024-03-06 at 10 58 12 Screenshot 2024-03-06 at 10 58 16

Note that I didn't use v7.0.0-beta.5 yet, is this maybe fixed in this version?

Your environment

Used Chrome: 122.0.6261.94

`npx @mui/envinfo`
   System:
    OS: macOS 14.2.1
  Binaries:
    Node: 20.4.0 - ~/.nvm/versions/node/v20.4.0/bin/node
    npm: 9.7.2 - ~/.nvm/versions/node/v20.4.0/bin/npm
    pnpm: 8.13.1 - ~/.nvm/versions/node/v20.4.0/bin/pnpm
  Browsers:
    Chrome: 122.0.6261.94
    Edge: Not Found
    Safari: 17.2.1
  npmPackages:
    @emotion/react: 11.11.3 => 11.11.3
    @emotion/styled: 11.11.0 => 11.11.0
    @mui/icons-material: 5.15.10 => 5.15.10
    @mui/lab: 5.0.0-alpha.165 => 5.0.0-alpha.165
    @mui/material: 5.15.10 => 5.15.10
    @mui/system: 5.15.9 => 5.15.9
    @mui/types: 7.2.13 => 7.2.13
    @mui/x-data-grid: 7.0.0-beta.4 => 7.0.0-beta.4
    @mui/x-data-grid-generator: 7.0.0-beta.4 => 7.0.0-beta.4
    @mui/x-data-grid-premium: 7.0.0-beta.4 => 7.0.0-beta.4
    @mui/x-data-grid-pro: 7.0.0-beta.4 => 7.0.0-beta.4
    @mui/x-date-pickers: 6.17.0 => 6.17.0
    @mui/x-date-pickers-pro: 6.17.0 => 6.17.0
    @mui/x-tree-view: 6.17.0 => 6.17.0
    @types/react: 18.2.58 => 18.2.58
    react: 18.2.0 => 18.2.0
    react-dom: 18.2.0 => 18.2.0
    styled-components: 5.3.5 => 5.3.5
    typescript: 5.3.3 => 5.3.3

Search keywords: renderCell cell alignment grid datagrid position position
Order ID: 54728

@TiagoPortfolio TiagoPortfolio added status: waiting for maintainer These issues haven't been looked at yet by a maintainer support: commercial Support request from paid users labels Mar 6, 2024
@TiagoPortfolio
Copy link
Contributor Author

Opened a bug instead: #12348

@github-actions github-actions bot removed the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Mar 6, 2024
Copy link

github-actions bot commented Mar 6, 2024

⚠️ This issue has been closed.
If you have a similar problem, please open a new issue and provide details about your specific problem.
If you can provide additional information related to this topic that could help future readers, please feel free to leave a comment.

How did we do @TiagoPortfolio?
Your experience with our support team matters to us. If you have a moment, please share your thoughts through our brief survey.

@oliviertassinari oliviertassinari added the component: data grid This is the name of the generic UI component, not the React module! label Jul 24, 2024
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! support: commercial Support request from paid users
Projects
None yet
Development

No branches or pull requests

2 participants