Вставка box-shadow не работает в IE9 - PullRequest
1 голос
/ 02 апреля 2012

Я пытаюсь применить следующую тень на некоторых кнопках, используя SASS:

    @mixin innerShadow {
    -webkit-box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, .45);
    -moz-box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, .45);
    box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, .45); 
}

.button {
    display: inline-block;
    @include roundedCorners(5px);
    @include innerShadow;
    padding: 0.45em 1.5em 0.5em;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    &:active {
        position: relative;
        top: -1px;
    }
}

Он отлично работает в Firefox, Safari, Opera и Chrome, но в IE9 тень просто не отображается вообще. Он также не работает с тенью от внешнего блока, и я не определяю цвет с помощью шестнадцатеричного кода вместо RGBA.

Это не острая проблема, так как без нее кнопки выглядят нормально, но мне было интересно, знает ли кто-нибудь, почему это может происходить. Я проверил, что у меня есть допустимый тип документа, и что на странице нет элементов с border-collapse.

Спасибо.

1 Ответ

1 голос
/ 07 мая 2012

Лучше использовать компас для CSS3, потому что вам не нужно писать префиксы поставщиков. Вы можете попробовать это здесь http://compass -style.org / examples / compass / css3 / box_shadow /

Я попробовал ваш css с тегом "a" в IE9, и у меня это работает.

Итак, ваш CSS box-shadow работает, проблема, вероятно, в вашем html.

...