Text extends past screen when using full width about toastr HOT 4 CLOSED

Thanks. I added a fix to the CSS and LESS files (but not the min files yet). Please try test them out from github here and if they work I'll make the rest of the changes and put them in v1.2.3

See commit 35184ca

from toastr.

Thanks for the quick response!

Unfortunately the fix doesn't work with small screens (I'm doing mobile web). It seems like the padding on the outer div (.toast) is not taken into account by the text div. Adding a right margin on the inner div seems to work, although it breaks the responsive design by not adjusting the margin for smaller screens.

Not sure if a good solution though, I'm not that great with css.

// overrides
    &.toast-top-full-width > div,
    &.toast-bottom-full-width > div {
        width: 100%;
        margin: auto;

        > div {
            margin-right: 65px;
        }
    }

from toastr.

I'm asking Hans to take a look.

from toastr.

I added box-sizing: border-box to all toastr elements to eliminate such problems.

Pushed to http://codeseven.github.io/toastr so test it out. Changes can be seen in 4bb44db.

from toastr.