Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug] Position incorrect when viewing in cell phone mode or narrow window on Blazor Server #231

Open
slamarreacosta opened this issue Oct 7, 2023 · 1 comment
Labels
Bug Something isn't working Triage Issue needs to be triaged

Comments

@slamarreacosta
Copy link

Describe the bug
Position incorrect when viewing in cell phone mode or narrow window on Blazor Server

I set the Position like this in my MainLayout.razor

image

If I maximize my Chrome window on Windows, then the toast is showing on the bottom right as expected. However, when I resize the window very narrow to emulate a cell phone, the toast is showing on the bottom left side as show below. This behavior is consistent also using Chrome on a device.

To Reproduce
Steps to reproduce the behavior:

  1. Set the Position="ToastPosition.BottomRight"
  2. Resize Chrome to a narrow state
  3. Click a button to show the toast
  4. See the toast appearing on the bottom left side.

Expected behavior
The Toast should show at the bottom right even if the Chrome window is narrow.

Screenshots
image

Hosting Model (is this issue happening with a certain hosting model?):

  • Blazor Server

Additional context
Add any other context about the problem here.

@slamarreacosta slamarreacosta added Bug Something isn't working Triage Issue needs to be triaged labels Oct 7, 2023
@SuperPigBlog
Copy link

SuperPigBlog commented Feb 5, 2024

i got this problem ,when i chang the size of screen up to 575px(or any size less than 576 );i add some code into xx.razor.css, main ::deep .position-bottomright { bottom: 2rem; right: 2rem; }
xx is your container layout ,
otherwise others Position is the same
it work great!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Bug Something isn't working Triage Issue needs to be triaged
Projects
None yet
Development

No branches or pull requests

2 participants