CODEWITHSUNDEEP
reactjsmaterial-uidrawer
user2420225
user2420225

Reputation: 107

is there a way to make material ui drawer fixed height (and anchored the bottom)

Trying to have a material-ui Drawer anchored to the bottom of the viewport, but of a fixed height - will have scrollbars for extra content. Is this possible with a Drawer ?

<Drawer
  className={classes.drawer}
  variant="permanent"
  anchor="bottom"
  open={drawerOpen}
  classes={{
    paper: classes.drawerPaper,
  }}
>

Upvotes: 3

Views: 3372

Answers (1)

Ryan Cogswell
Ryan Cogswell

Reputation: 80966

You just need to set the height of the Paper element within your drawerPaper class.

For instance:

const useStyles = makeStyles(theme => ({
  drawerPaper: {
    width: 240,
    height: 300
  }
}));

And then use the drawerPaper class as shown in your question (classes={{paper: classes.drawerPaper}}).

Edit Bottom drawer fixed height

Upvotes: 1

Related Questions