Comments (4)
Hi @T-Grave
I'm not 100% sure the DataGrid should inherit the parent's height as you expected.
I forked your sandbox and replaced the data grid with 2 div
s instead to see how would regular HTML elements behave in this situation: https://codesandbox.io/s/mui-x-issue-template-forked-kxxvw3?file=/src/App.tsx
The behavior seems to be identical to the current behavior of the data grid.
I prefer to keep this behavior unless there's a strong argument to do otherwise.
What do you think?
from mui-x.
hey @T-Grave
You can achieve this behavior by adding this.
[`& .MuiDataGrid-virtualScroller`]: {
flex: "1 1 0px",
overflow: "auto"
}
demo: https://codesandbox.io/s/mui-x-issue-template-forked-m5hlqs
from mui-x.
Thank you @yaredtsy the workaround seems to be working as expected. Either way, we need to see what caused the degradation in functionality.
from mui-x.
hey @DanailH
This issue was caused by #8091. When GridAutoSizer
was removed, the component responsible for handling resize based on flex
was also removed with it. we can fix it like this.
--- a/packages/grid/x-data-grid/src/components/virtualization/GridVirtualScroller.tsx
+++ b/packages/grid/x-data-grid/src/components/virtualization/GridVirtualScroller.tsx
@@ -25,6 +25,8 @@ const VirtualScrollerRoot = styled('div', {
})<{ ownerState: OwnerState }>({
overflow: 'auto',
height: '100%',
+ flex: '1 1 0',
// See https://github.com/mui/mui-x/issues/4360
position: 'relative',
'@media print': {
demo : https://codesandbox.io/s/mui-x-issue-template-forked-rn9zfz?file=/src/App.tsx
from mui-x.
Related Issues (20)
- [data grid] How can I add an event handler on each row to handle file drops HOT 4
- [pickers] Build error because of `@mui/utils/clamp` HOT 9
- [pickers][MobileDatePicker] Too much recursion error when using MobileDatePicker inside a IonModal component HOT 1
- [data grid] Filter panel columns customize HOT 3
- [pickers][DateRangePicker] Separately disable start and end date picking HOT 10
- [data grid] Multi Selection functionality in the Columns visibility panel HOT 1
- [data grid] `valueGetter` row is always never HOT 3
- [license] I just bought a new license and got a new license key, but I don't want to change my previous key. HOT 5
- [data grid] Is there a property to tell the grouping row column to ignore the valueFormatter/renderCell ? HOT 1
- [data grid] How do I save the filtered row data to state? HOT 6
- [pickers] Create RTL demo example HOT 2
- [data grid] Warn when `scrollToIndexes` has invalid arguments HOT 2
- [data grid] RenderHeader value is not being used in manage column component ? HOT 4
- [data grid] The cell selection color is not being applied HOT 2
- [data grid] Show/Hide All Columns, if all columns are hidden, unable to restore visibility. HOT 2
- [data grid] add "is not any of " in "singleSelect" type for filters HOT 1
- [Time Picker] button tomorrow HOT 2
- [charts] `categoryGapRatio` & `barGapRatio` is not a known property of `ChartXAxis` HOT 5
- [charts][docs] Need to document how to create a custom tooltip axisContent HOT 5
- [data grid] Change child table width on change of parent table HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from mui-x.