Search code examples
javascriptcssreactjsfrontendless

why the menu is not show all content

here s the project
github
when I click the button on the top-right corner, it will show a menu. but the menu is covered. enter image description here

enter image description here

I try to remove the Profile component.. but still not work. then, I try to set z-index for the menu. still not work I'm study css rigth now. if you can explain the reason, that's very helpful. thank you~

Solution

  • You should set the z-index of main section to 0. And should make the position of menu to fixed. Absolutely positioned elements are positioned with respect to a containing block, which is the nearest postioned ancestor. If there is no positioned ancestor, the viewport will be the containing block. Elements with fixed positioning are fixed with respect to the viewport—the viewport is always their containing block. Change this