Дублированные значки с toastr

У меня есть несколько значков друг на друга в сообщении toastr. Это выглядит так:

Мой код очень прост, я использую toastr после вызова Ajax:

 success        : function(reponse) {
            $(event.target).next('i').hide();
            if (reponse.retour == 0){
                toastr["success"](reponse.texte_retour);
                } else {
                toastr["error"](reponse.texte_retour);
                }
        }

У меня такая же проблема, какой бы тип (ошибка, информация, предупреждение, успех). Что происходит не так?

Ответ 1

Другой способ решить эту проблему - загрузить toastr css перед загрузкой css inspinia. Таким образом, Inspinia перезаписывает toastr css со своим собственным css

Ответ 2

Проблема решена.

Я использую 'inspinia framework'. в его таблице стилей уже есть объявление somme css о toastr:

Я прокомментировал эти несколько строк, и теперь он отлично работает. Не знаю, является ли это ошибкой или нет на стороне "inspinia".

Доминик

Ответ 3

Похоже, вы используете значки шрифтов и значки по умолчанию.

Добавление этого в ваш css должно устранять перекрывающиеся значки, скрывая изображение по умолчанию.

#toast-container > div.toast {
    background-image: none !important;
}

Также, если вы хотите вертикально по центру добавить изображение

#toast-container > .toast:before {
    position: absolute;
    margin: auto 1.5em auto -1.5em;
    top: 50%;
    transform: translateY(-50%);
}

Ответ 4

У меня была такая же проблема, я проверил ссылки на мои css, я обнаружил, что я вызываю "toastrStyles" css после "inspania" css. Я перезвонил, назвав свой "toastrStyles" css, прежде чем называть "inspania" css, и это сработало для меня.

Ответ 5

Ничего не поделаешь ни с какими настройками css. toastr css сразу после boostrap (если используется) и перед любыми другими css-ссылками. Он будет работать без каких-либо проблем.

это нравится:

 <link href="~/Content/bootstrap.min.css" rel="stylesheet">
 <link href="~/Content/plugins/toastr/toastr.min.css" rel="stylesheet">

.... оставшиеся ссылки здесь после..... приходит

Ответ 6

У меня возникла такая же проблема с Inspinia. Причина заключалась в том, что я загрузил файл toastr css после файла css inspinia (style.css), заставив toastr css перезаписать стили inspinia.