IE 11 не распознает границы изображения на моем сайте

На моем WordPress http://www.diylowell.org/test/Wordpress/

У меня есть изображение границы, установленное для постов в области виджетов со следующим CSS:

  #secondary .widget_siteorigin-panels-postloop .post {
        border: 30px solid transparent;
        -webkit-border-image:url("border-thick.png") 30 stretch;
        -moz-border-image:url("border-thick.png") 30 stretch;
        -o-border-image:url("border-thick.png") 30 stretch;
        border-image:url("border-thick.png") 30 stretch;
        padding-bottom: 0px;
    }

Изображение границы отображается в нескольких версиях Chrome, Firefox и Safari, но по какой-то причине не работает в IE11. Я проверил с помощью функции F12, и IE действует так, как будто он не распознает атрибут (ставит извилистую строку под ним.)

Я даже скопировал и вставил CSS с других веб-сайтов, изображения границ которых работают в IE11, на мой собственный сайт, и это не работает. Может ли быть какой-то код в моей теме или плагинах, который мешает работе border-image в IE11?

Источник

2 ответа

Это может ответить на ваш вопрос:

Поддерживает ли Internet Explorer 11 изображение границы?

Обратите внимание, что и border-style, и border-width должны быть указаны для работы с изображениями границ в соответствии со спецификацией, хотя в более старых реализациях этого требования может не быть. Частичная поддержка относится к поддержке сокращенного синтаксиса, но не отдельных свойств (border-image-source, border-image-slice и т. Д.).

Да, возможно, вы сделали: border: 30px solid transparent; однако IE11, кажется, требует, чтобы вы определяли стиль границы и ширину границы отдельно, а не от border: имущество.

Источник

В аналогичном случае я указал border: solid а также border-width: 0 0 5px 0и нижняя граница отображалась по желанию, как в IE (11), так и в Chrome.

Я закомментировал border: solid и изображение границы исчезло в IE, но осталось в Chrome.

Определение border: solid должно сработать.

Источник
Другие вопросы по тегам