[Grid] Covering full height
See original GitHub issueProblem description
I’m implementing the grid container in v1 and it isn’t taking up the full height of the viewport, as expected.
Link to minimal working code that reproduces the issue
<Grid
container
align={'flex-start'}
>
<Grid item>
<Sidebar />
</Grid>
</Grid>
Versions
-
Material-UI:
-
React:
-
Browser:
Issue Analytics
- State:
- Created 6 years ago
- Reactions:13
- Comments:10 (6 by maintainers)
Top Results From Across the Web
force css grid container to fill full screen of device
How do I force a css grid container take the full width and height of the device screen for a single page app?...
Read more >A Complete Guide to CSS Grid
Our comprehensive guide to CSS grid, focusing on all the settings both ... to allow the grid to fill the full height of...
Read more >grid-template-rows - CSS: Cascading Style Sheets | MDN
The grid-template-rows CSS property defines the line names and track ... that track (specified by the min-width / min-height of the items).
Read more >[Grid] Covering full height #7442 - mui/material-ui - GitHub
If you want a full-height grid use the makeStyles and set the root class to be 100vh. For example,. here is a component...
Read more >How To Make a DIV Full Height of the Browser Window
Learn how to stretch elements to fit the whole height of the browser window with CSS. Full Height Div. Example. html, body {...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
People can always define a height to the component.
I’m closing the issue as the grid wasn’t designed to take the full height of the viewport.