RadZen Notification Position

Radzen.Blazor Components
1

Are we able to change the position of the RadZen notification to Bottom Right instead of Upper Right? I do not see any documentation on doing so?

2

Hi @Mike_Hartwig,

At the moment changing the position of the notification is not supported.

3

I'd consider this an essential development!

What if it obscures some important information?

4

Has this been addressed yet ?
At the moment I'm not able to change the position of the notification even when I override the different styles.
I have tried overriding the notification style without any effect:
.rz-notification-message.rz-growl {
position: fixed;
width: 35%;
Bottom: 0px;
right: 0px;
}

5

if I experiment with the css elements on the dev tools window, I am able to change to width and position to my desired outcome, but when I apply it on my css style file, it doesn't override !

6

Try using the !mportant modifier so it overrides the inline style.

.rz-notification-message.rz-growl {
position: fixed;
width: 35%;
bottom: 0px !important;
right: 0px !important;
}
1 Like
7

@korchev,
Thank you for the tip. I got it to display at the bottom right of the page by adding the following:
.rz-notification-message.rz-growl {
position: fixed !important;
width: 35% !important;
bottom: 0px !important;
right: 0px !important;
top: unset !important;
}

8

@korchev
Hi !!
If you click multiple times, the display position cannot be changed.
Is there any way?

9

.rz-notification {
bottom: 0 !important;
float: left !important;
left: 10px !important;
top: unset !important;
right: unset !important;
}

1 Like