OuterDiv盒子陰影總是在頂部

我有我的主容器div有盒子陰影。將會有一個內部分區，其中將包含一個列表。我希望盒子陰影始終位於內部容器的頂部，因此如果列表超出div範圍，它將隱藏在陰影之後。OuterDiv盒子陰影總是在頂部

這裏是代碼：

<div class="main-container bg-logged-in"> 

<div class="data scrollbar" id="agenda-data"> 
</div> 


</div> 

.bg-logged-in { 
background: none repeat scroll 0 0 #3f3f3f; 
    box-shadow: 0 -2.2em #25a0da inset, 0 -2.7em #3f3f3f inset, 0 -3em #25a0da inset; 
    left: 0; 
    right: 0; 

} 

.content-left .data { 
    bottom: 1em; 
    height: 65%; 
    top: 6.5em; 
    width: 100%; 
} 
.scrollbar { 
    overflow-y: auto; 
}

來源

2014-09-01 user3150994

請給出你的嘗試，提供一個小提琴 – Husen 2014-09-01 09:57:22

你嘗試溢出：隱藏屬性？ – 2014-09-01 10:00:08

從您的示例，它仍然不清楚你想要實現什麼，它應該是什麼樣子。另外，你的盒子陰影定義看起來不正確。 – 2014-09-01 10:45:46

看看這個：

.bg-logged-in { 
background: none repeat scroll 0 0 #3f3f3f; 
left: 0; 
right: 0; 
-webkit-box-shadow: 8px 6px 13px 0px #25a0da; 
-moz-box-shadow: 8px 6px 13px 0px #25a0da; 
box-shadow:   8px 6px 13px 0px #25a0da; 
}

JSFiddle Link

可以使用this網站生成你的箱子的影子。

來源

2014-09-01 10:58:00 anik4e

謝謝，它的工作原理 – user3150994 2014-09-02 11:07:34

歡迎。請接受答案。 – anik4e 2014-09-02 11:28:40

OuterDiv盒子陰影總是在頂部

回答

相關問題