search

CodeSeven / toastr

Simple javascript toast notifications
http://www.toastrjs.com
MIT License
11.94k stars 2.04k forks source link

Full width toast don't work in bootstrap 4.3.1 #611

Open bezzad opened 5 years ago

bezzad commented 5 years ago

I update the bootstrap to the new version and I saw the "positionClass": "toast-top-full-width" don't work at the bootstraps upper than 4.2.x

mreale commented 4 years ago

I'm experiencing the same issue with a large project. Sadly, it became a NoGo to me.

meshachviktor commented 4 years ago

I just discovered this problem too and decided to check the issues section to see if one has been opened concerning the issue and hopefully solved. Seeing that it has no solution i decided to do some debugging and found out that it is the .toast classname of the plugin that is conflicting with bootstrap's toast feature with a class of the same name. the max-width value for the .toast class in bootsrap is 350px. The following code is what i used to solve the problem: .toast { max-width: 100%; } To ensure that the fix will work use the override after bootstrap css and toastr css are loaded respectively. I suggest that the author of the plugin starts to use vendor prefix as part of the classnames in the css code to prevent further classname conflicts as i recently encountered a situation where the toast would not show any colour regardless of any type of message i try to make it display.

mariusa commented 1 year ago

Neither in bs 5.2.x