I have a mat-sidenav component filled with mat-card components. Outside the sidenav, I have the rest of my page. What I would like is for my sidenav card components to keep the exact same size as someone is zooming in and out the page. I have illustrated what I mean:
The image on the left shows my page before zooming, the right side is after the zoom. The content outside the sidenav (the boxes) zoom and scale accordingly, my sidenav itself has a max width set that it does not exceed even after zooming (I have achieved this). My problem lies in the mat card components (represented as circles). I would like my mat cards to also remain the same size after zoom as seen in the image, however, they grow like my components outside the sidenav. My mat cards are also wrapped individually in an <a> tag. I need it as if zooming in and out does not effect the sidenav nor its contents at all, how can I achieve this?
