Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
Программирование. Ступени успешной карьеры. Авторы: Кузнецов М.В., Симдянов И.В. PHP на примерах (2 издание). Авторы: Кузнецов М.В., Симдянов И.В. MySQL 5. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. Самоучитель MySQL 5. Авторы: Кузнецов М.В., Симдянов И.В. Объектно-ориентированное программирование на PHP. Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум (новые сообщения вниз) Структурный форум

тема: Использование тени по диагонали у блока

Сообщения:  [1-2] 

 
 автор: immortal727   (10.11.2013 в 12:18)   письмо автору
 
   для: immortal727   (09.11.2013 в 18:17)
 

Помогите пожалуйста

  Ответить  
 
 автор: immortal727   (09.11.2013 в 18:17)   письмо автору
1.9 Мб
 
 

Не могу понять почему когда делаю тени по диагонали, то они не показываются для блока. Идет работа со слоями. Тени представляют собой блоки, которые заходят за главный, но немного выступают

В html и дет
<div id="slider"></div>

В css прописываю:
#slider{
    height:120px; 
    background: #FFF; /* Цвет фона */
    
    /*box-shadow: 0 5px 7px 0 rgba(0,0,0,0.9); /* Параметры тени */
    /*filter: progid:DXImageTransform.Microsoft.dropshadow(offX=0, offY=5, color=#000000);*/ /* Для IE9 */
    height:400px
    margin:0 auto;
    position:relative;
}

#slider:before {
z-index:-1; 
position:absolute; 
content:"";
width:450px;
height:7px;
left:0;
top:145px;
box-shadow:0 10px 4px rgba(0, 0, 0, 1);
-webkit-transform:rotate(-2deg);    
-moz-transform:rotate(-2deg);   
-o-transform:rotate(-2deg);
-ms-transform:rotate(-2deg);
transform:rotate(-2deg);
}
#slider:after {
z-index:-1; 
position:absolute; 
content:"";
width:450px;
height:7px;
right:0;
top:145px;
box-shadow:0 10px 4px rgba(0, 0, 0, 1);
-webkit-transform:rotate(2deg);
-moz-transform:rotate(2deg);
-o-transform:rotate(2deg);
-ms-transform:rotate(2deg);
transform:rotate(2deg);


Если ставить z-index не -1, а 1, то они видны, но не заходят как надо за главный #slider

  Ответить  

Сообщения:  [1-2] 

Форум разработан IT-студией SoftTime
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования