After changing toastClass when open multiple toasts, they appear on same position, not pilling up

[lucaspajarita]

my toast config ToastrModule.forRoot({ timeOut: 5000, toastClass: 'toast-custom-style', preventDuplicates: true, newestOnTop: false })

my custom class 

toast-custom-style{ background-color: #47211e; background-clip: border-box; position: fixed; top: 14px; left: 14px; z-index: 99999; padding: 4px; word-wrap: break-word; white-space: pre-line; height: auto !important; width: 300px; border: 12px solid transparent; border-radius: 6px; border-image: url(./assets/ui/border_style_toast.png) 12 round; }

[prajwal-np]

. toast-custom-style { 
background-color: #47211e; 
background-clip: border-box; 
/* position: fixed; */
 /* top: 14px; */
  /* left: 14px; */
z-index: 99999; 
padding: 4px; 
word-wrap: break-word; 
white-space: pre-line; 
height: auto !important; 
width: 300px; 
border: 12px solid transparent; 
border-radius: 6px; 
border-image: url(./assets/ui/border_style_toast.png) 12 round;
 }

this will work. position: fixed is causing the issue as all the toast will have fixed position and given top and left.

[lucaspajarita]

I'v been tried this, but without fixed position, all toasts are opening in bottom left. The positionClass option on app.module.js is not working when I change the toastClass

[lucaspajarita]

i Don't know why, but positionClass not working. Maybe something in my root scss causing this crash, but removing only position fixed, and remaing top and left, it's work correctly.

Final code:

``
ToastrModule.forRoot({
timeOut: 5000,
toastClass: 'toast-custom-style',
newestOnTop: true
})

.toast-custom-style{
background-color: #47211e;
background-image: none !important;
background-clip: border-box;
top: 14px;
left: 14px;
z-index: 99999;
padding: 4px;
word-wrap: break-word;
white-space: pre-line;
height: auto !important;
width: 300px;
border: 12px solid transparent;
border-radius: 6px;
border-image: url(./assets/ui/border_style_toast.png) 12 round;
}``

Tks prajwal-np :D