https://i.stack.imgur.com/Ra0c7.png
I'm trying to ensure that the width of the sidebar on this page aligns consistently with the end of the logo in the top right. However, using variations of col-xxl-1 etc. is causing inconsistent sizes at different screensizes. How can I achieve this alignment?
Thank you.
UPDATE: After exploring various options, it became clear that adjusting column sizes would not solve the issue of alignment.
- Pass the exact width to a css class for the sidebar
- Set the sidebar to a col-auto size and place the logo inside the sidebar but make it invisible
- Move the sidebar to the top and have the top navbar come after. Essentially, the page would be split into two columns: one for the sidebar and one for the navigation and content