Правила     Закладки     Карма    Календарь    Журналы    Помощь    Поиск    PDA    Чат   
        СМС-ки
   
Пейджер выключен!
 
Фильтр авторов:    показать 
  скрыть
  Ответ в темуСоздание новой темыСоздание опроса

> Проблема отображением тени
Фибер Оптик  
 ۩  [x] Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Пользователь
**

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 85
Пользователь №: 16771
На форуме: 7 лет, 10 месяцев, 3 дня
Карма:




Здравствуйте.
При вёрстке возникла проблема с отображением тени у блоков.
Делаю следующее:

<div id="container">
<ul
id="stage">
<li>
<div
class="item">
<a
href="catalog.html"><img src="pic/pic1.png" alt="" /></a>
<h3><a
href="#">П1</a></h3>
</div>
</li>
<li>
<div
class="item">
<a
href="catalog.html"><img src="pic/pic1.png" alt="" /></a>
<h3><a
href="#">П1</a></h3>
</div>
</li>
<li>
<div
class="item">
<a
href="catalog.html"><img src="pic/pic1.png" alt="" /></a>
<h3><a
href="#">П1</a></h3>
</div>
</li>
<li>
<div
class="item">
<a
href="catalog.html"><img src="pic/pic1.png" alt="" /></a>
<h3><a
href="#">П1</a></h3>
</div>
</li>
</ul>
</div>



#container li{
float: left;
list-style: none;
}


#container li .item{
background:#FFF;
padding:30px 20px;
box-sizing:border-box;
box-shadow: 0 0 8px 0 rgba(63, 69, 75, 0.5);
-webkit-transition:all 0.1s linear;
-o-transition:all 0.1s linear;
-moz-transition:all 0.1s linear;
transition:all 0.1s linear;
}
#container li .item:hover {
box-shadow: 0 0px 10px 0px rgba(63, 69, 75, 1);
position: relative;
z-index:1;
}
#container li .item img {
display:block;
margin:0 auto;
border-bottom:1px solid #dfdfdf;
}
#container li .item h3 a{
text-decoration:none;
color:#0099ff;
font-weight:bold;
display:block;
text-align:center;
margin-top:28px;
}


#container ul{
overflow:hidden;
}


Это некое меню категорий, пункты которого имеют тень.
Так вот у самого левого элемента, тень не отображается по его левую сторону, а у самого правого элемента тень не отображается по правую сторону этого элемента. Видимо то пространство, которое ограничивает UL обрезает тень.

Что можно с этим сделать?
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
redreem  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 4258
Пользователь №: 29002
На форуме: 5 лет, 4 месяца, 6 дней
Карма: 147




попробуй для ul overflow:visible
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Guest  
Дата
Цитировать сообщение


Гость пожелал остаться неизвестным

Unregistered









да, заработало. Спасибо большое
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
  Быстрый ответ
Информация о Госте
Введите Ваше имя
Кнопки кодов
Для вставки цитаты, выделите нужный текст и
НАЖМИТЕ СЮДА
Введите сообщение
Смайлики
:huh:  :o  ;) 
:P  :D  :lol: 
B)  :rolleyes:  <_< 
:)  :angry:  :( 
:unsure:  :blink:  :ph34r: 
     
Показать всё

Опции сообщения  Включить смайлики?
 Включить подпись?
 
1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:

Опции темы Ответ в темуСоздание новой темыСоздание опроса