Inner Box Shadow Div

Question

需要幫助轉換一些我在良好的瀏覽器中工作的CSS，現在可以用於Internet Explorer。這就是我現在所擁有的

.headerLoginFooter 
{ 
    background-color:#f5f5f5; 
    padding:7px 10px 7px 10px; 
    margin:20px 0 0 0; 
    -moz-box-shadow:inset 0 8px 6px -6px #c4c4c4; 
    -webkit-box-shadow:inset 0 8px 6px -6px #c4c4c4; 
    box-shadow:inset 0 8px 6px -6px #c4c4c4; 
} 

末的三個屬性正在生產的登錄框的該div，看起來像這樣

我頁腳部分內的內發光能夠在這裏獲得這個樣式的代碼CSS Tricks，但我需要使其與Internet Explorer兼容。我的第一個問題是我只有一個mac，所以我沒有Internet Explorer來輕鬆測試我的代碼。我的第二個問題是我沒有得到如何在代碼中轉換上面的代碼。有人可以幫助我轉換我的上述代碼，以遵循鏈接中的指導原則爲Internet Explorer工作。謝謝。

Answer 1

IE是非常有很多CSS3功能，特別是舊版本的問題。

我建議在你的CSS樣式表中使用CSSpie。這已被回答以前here。

有些東西能防止箱陰影從工作在IE：（如果它們被應用於相同的元件）

• 圓角/ border-radius
• overflow:hidden
• background-color
• 背景梯度

爲了克服這個問題，我通常嵌套一個conta在我想用箱子陰影的樣式裏面。

<style> 
.boxShadow { 
behavior: url(PIE.htc); 
-webkit-box-shadow: inset 0 8px 6px -6px #c4c4c4; 
-moz-box-shadow: inset 0 8px 6px -6px #c4c4c4; 
box-shadow: inset 0 8px 6px -6px #c4c4c4; 
overflow:visible; 
} 
.otherStyles{ 
background-color:#f5f5f5; 
border-radius:0px;/*or other value*/ 
/*gradients can be placed here too.*/ 
} 
</style> 
<div class="boxShadow"> 
    <div class="otherStyles"> 
    ...content... 
    </div> 
</div>