How to align a button at the button of the sidebar?

Anvil Q&A
1

Hi guys! New to Anvil here.

I want to build a sidebar wherein it has a fixed length such that the ColumnPanel covers the full length of my laptop mandatorily (I don’t want that as the data in the sidebar increases, so does the sidebar) and at the end of the sidebar, there is a button to log out of the screen.

So far, I’ve searched through the documentation to find any methods of doing, and even searched the Forums but none of the fixes I’ve found work for me.

I’ve tried to create this custom CSS role, but it doesn’t work:

.anvil-role-cp-with-button-700px {
    min-height: 700px;
    max-height: 700px;
}

.anvil-role-cp-with-button-700px > .btn {
    align-items: flex-end;
}

I’ve also scorched through the documentation to see if there’s another way of doing this, but the only one I found was using an XY Panel, but the alignment in that very tricky and I’ve been unsuccessful doing that.

Is someone please tell me how to do this?

2

If I understand you correctly. You want to add an additional sidebar? It’s always better to share minimal clone of your app or some picture of the problem.

max-height ensure only that it won’t be higher than some size. It won’t change the size.

Don’t use px to set it. It changes depending of the screen size (1080p, 4k etc.). Use vh (view height) or vw (view width)

height: calc(100vh - 54px);

54px to leave the place for the top app nav bar

And regarding the button look there.