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

[Grid] Avoid using negative margins to provide spacing between Grid Items #31368

Closed
2 tasks done
RajeevPullat opened this issue Mar 8, 2022 · 1 comment
Closed
2 tasks done
Labels
component: Grid The React component. duplicate This issue or pull request already exists

Comments

@RajeevPullat
Copy link

Duplicates

  • I have searched the existing issues

Latest version

  • I have tested the latest version

Summary 💡

Please avoid using Negative Margins to provide spacing between Grid Items. Its making layut with Grid so frustrating experience , to the point considering about using another UI Library. :(

For a basic layout even have to write custom styles with sx prop to clear the mess of Negative Margins.

Examples 🌈

https://codesandbox.io/s/materialgriddilemma-vheq19?file=/src/Layout.js

Motivation 🔦

For a basic layout even have to write custom styles with sx prop to clear the mess of Negative Margins.

@RajeevPullat RajeevPullat added the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Mar 8, 2022
@RajeevPullat RajeevPullat changed the title Please avoid using Negative Margins to provide spacing between Grid Items. Its making layut with Grid so frustrating experience. Please avoid using Negative Margins to provide spacing between Grid Items. Its making layout with Grid so frustrating experience. Mar 8, 2022
@danilo-leal danilo-leal changed the title Please avoid using Negative Margins to provide spacing between Grid Items. Its making layout with Grid so frustrating experience. [Grid] Avoid using negative margins to provide spacing between Grid Items Mar 8, 2022
@danilo-leal danilo-leal added the component: Grid The React component. label Mar 8, 2022
@michaldudak
Copy link
Member

This seems to be a duplicate of #29266. Feel free to reopen if it's not the case.

@michaldudak michaldudak added duplicate This issue or pull request already exists and removed status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels Mar 11, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: Grid The React component. duplicate This issue or pull request already exists
Projects
None yet
Development

No branches or pull requests

3 participants