WONDROUS
Silver Member | Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
VVL99
Спасибо, но я пока оставил затею с большими картинками, оставил для маленьких PNG.
Очередная небольшая заморочка. Есть код:
Код: .box13 {
padding: 5px;
margin-bottom: 40px;
position: relative;
display: inline-block;
}
.box13:before, .box13:after {
content: "";
position: absolute;
z-index: -1;
}
.box13:after {
bottom: 0;
box-shadow: 0 40px 25px #ccc;
height: 50px;
left: 10%;
width: 80%;
transform: perspective(480px) rotateX(60deg);
} |
Если делать так, как в данном коде, то при просмотре всё нормально, но глючит всё в редакторе при редактировании.
Если сделать так:
Код: .box13 {
padding: 5px;
margin-bottom: 40px;
position: relative;
display: inline-block;
perspective: 480px;
}
.box13:before, .box13:after {
content: "";
position: absolute;
z-index: -1;
}
.box13:after {
bottom: 0;
box-shadow: 0 40px 25px #ccc;
height: 50px;
left: 10%;
width: 80%;
transform: rotateX(60deg);
} |
то в редакторе нормально, ничего не глючит, но при просмотре и в браузере видна тень поверх, хоть у неё и z-index -1.
В чём косяк кода? |
