CSS-тень вокруг треугольника

Мне нужно создать треугольник с падающей тенью, используя простые html и css. Ответив на другой вопрос о stackoverflow, я смог создать треугольник со скошенными границами. Обычно я создаю одну сторону бокса с очень широкой рамкой, а соседнюю сторону - с широкой прозрачной рамкой:

div.triangle {
    border-bottom : 60px solid transparent;
    border-left : 60px solid black;
}

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

div.triangle {
    border-bottom : 60px solid transparent;
    border-left : 60px solid black;
    -webkit-box-shadow: 0 0 10px black;
}

Как получить треугольник, используя только css / html с тенью?

12
задан at. 16 March 2011 в 21:59
поделиться