Radzen Right Sidebar Not working in Mobile [BUG]

Radzen.Blazor Components
1

I am trying to get my sidebar on the right side of the screen and its working perfect on a desktop screen.

Now to the problem. If you are using a screen with less then 769px the right sidebar does not work.
This is easy to test with your demo Here
image

If you set your screen width to 768 or less via Developer tools in the web browser then the right sidebar wont work.
I use Right and Left Sidebar as an refrence here

image
image758×765 18.7 KB

If you would press TOGGLE RIGHT SIDEBAR here nothing would happend.
However is left working fine.

At Right Sidebar and Right full height Sidebar the toggle button won't even show.

image
image719×461 4.35 KB

To make this test we can easily modify some of the css from this:
Style: "d-flex justify-content-end align-items-center"
To this:
class="d-flex justify-content-start align-items-center"
Then the sidebar toogle button appears so we can test the toogle and when we press it nothing happends.

image
image724×495 5.13 KB

Thanks.

1 Like
2

Try adding this CSS rule to your application. It should address the problem while we investigate it after the holidays.

@media (max-width: 768px) {
  .rz-header, .rz-footer, .rz-body {
     width: auto !important;
  }
}
2 Likes
3

Hi,

This css rule did fix it, however I thought i would check in to see if there was a long term fix that was introduced

4

hello @korchev. I have spent two days trying to fix that :joy:. I was following the radzen example page:

https://blazor.radzen.com/layout#right-left-sidebar

and the right panel still not working in screen with width 768 :sweat_smile:

5

Hi @developer9,

Thanks for bringing this up. The issue stems from legacy code and should be resolved with the next release.

6

Hello @yordanov. Thank you!. I have a question. What does mean that it issue stems from legacy? Is there a kind of new product version that I do not know.

7

It means the issue comes from older css styles. This 'legacy code' does not work well with the latest RadzenLayout components. It's not about a new product version — it's just that the bug is from older styles, and we’re fixing it in the next update.

8

Thank you for the clarification, @yordanov.