CODEWITHSUNDEEP
reactjsmaterial-ui
Sandhya
Sandhya

Reputation: 541

How to display the drawer list without overlapping using reactjs?

HI, I'm new to Material-UI, I've created a drawer but the problem is when i click on the Menu then it is going inside the drawer. Even if i do inspect, i minimize the page again the drawer is getting overlapped. My objective is - if i minimize the page a little bit also the table should get adjust with the page width, it should not go inside the drawer. Can anyone help me in this query?

Upvotes: 1

Views: 1577

Answers (1)

Puja Srivastava
Puja Srivastava

Reputation: 336

I've done some changes in your existing code.

https://codesandbox.io/s/competent-lovelace-7efpl

You can check the above link. Basically, you need to give sidebarWidth = margin-left in the component beside sidebar.

This is important because sidebar has a fixed positioning. So if something is added beside it it will go behind the sidebar. Material UI grid is not required according to me.

Upvotes: 2

Related Questions