Javascript-форум (https://javascript.ru/forum/)
-   (X)HTML/CSS (https://javascript.ru/forum/xhtml-html-css/)
-   -   Загнутый угол с тенью (https://javascript.ru/forum/xhtml-html-css/47696-zagnutyjj-ugol-s-tenyu.html)

BETEPAH 04.06.2014 12:37

Вложений: 2
Цитата:

Сообщение от Aetae
На самом деле основная проблема тут в тени

На тень в IE8 я забил. Как по мне это незначительная "рюшечка", отсутствие которой не сильно портит внешний вид.
Ну и треугольник все-таки оставил в png-шке. В итоге получилось вот так
.t2_special-popup_footer {
    height: 31px;
    width: 300px;
    display: block;
    position: absolute;
    bottom: -19px;
    background: #fff;
  }
  .t2_special-popup_footer:after {
    display: block;
    position: absolute;
    right: -69px;
    content: '';
    height: 31px;
    width: 78px;
    background: url("/images/newd/special_popup_corner.png");
    -moz-transform:     rotate(-25deg) translateX(5px) translateY(-13px) scale(1);
    -o-transform:       rotate(-25deg) translateX(5px) translateY(-13px) scale(1);
    -webkit-transform:  rotate(-25deg) translateX(5px) translateY(-13px) scale(1);
    transform:          rotate(-25deg) translateX(5px) translateY(-13px) scale(1);
    -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.9063077870366499, M12=0.42261826174069955, M21=-0.42261826174069955, M22=0.9063077870366499, SizingMethod='auto expand')";
    -webkit-box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.1);
  }

Еще раз всем огромное спасибо!


Часовой пояс GMT +3, время: 14:52.