Hi everyone! I have been working on developing this web app for a little while now and have come across an issue that I am not entirely sure how to fix. I have a sidebar setup and everything works just fine, but the arrows (not the whole slideshow, just the arrows) are overlapping everything on the page. I tried using z-index to fix it on both the sidebar and the slideshow, but it simply did not work. A video is attached bellow. Can someone offer some insight on this?
This is certainly a z-index problem. I believe the slideshow navigation has an z-index of 10, so the sidebar should have a higher number than that. Also it is important to know that the z-index only works on positioned elements (https://www.w3schools.com/cssref/pr_pos_z-index.asp).