Как отобразить список ящиков без наложения с помощью reactjs?

Question

Привет, я новичок в Material-UI, я создал ящик, но проблема в том, что, когда я нажимаю на Меню, оно открывается внутри ящика. Даже если я проверяю, я снова минимизирую страницу, когда ящик перекрывается. Моя цель - если я немного уменьшу размер страницы, стол также должен быть настроен по ширине страницы, он не должен go внутри ящика. Может ли кто-нибудь помочь мне в этом вопросе?

Answer 1

Я внес некоторые изменения в ваш существующий код.

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

Вы можете проверить ссылку выше. По сути, вам нужно указать sidebarWidth = margin-left в компоненте рядом с боковой панелью.

Это важно, потому что боковая панель имеет фиксированное положение. Так что, если что-то будет добавлено рядом с ним, оно будет go за боковой панелью. Сетка материала интерфейса не требуется по моему.