Вопросы Теги

box-shadow в IE9 не отображается с использованием правильного CSS, работает в Firefox, Chrome

Я пытаюсь имитировать тип плавающего модального блока, но у меня проблема с IE9 и его реализацией теневого блока.

Вот' Краткое изложение кода, который я использую, который может дублировать проблему: 

<html>
<head>
    <title>Sample page</title>
    <style>
        .content-holder {
            border-collapse: collapse;
        }
        .back {
            background-color: #a8c0ff;
            padding: 100px;
        }

        .inner {
            background-color: #fff;
            text-align: center;
            padding: 50px;
            box-shadow: 0px 0px 20px #000;
        }

    </style>
</head>
<body>
    <table class="content-holder">
        <tr>
            <td>
                <div class="back">
                    <div class="inner">
                        <h2>Heading</h2>
                        <p class="subtext">Some text here</p>
                        <p>More text</p>
                        <a class="button" href="#">A button</a>
                    </div>
                </div>
            </td>
        </tr>
    </table>
</body>

Он отлично работает в Firefox / Chrome и т. д., но IE9 не отображает тень. Я могу изменить его на внутреннюю тень, и она будет выглядеть так, как должна, но внешняя тень продолжает ускользать от меня.

Кто-нибудь может пролить свет на эту проблему с тенями?

71
задан random 6 March 2013 в 17:44
поделиться