Html 在IE7中使用CSS3饼图时如何解决元素中顶部边距的消除

你好

我使用了大量的CSS3效果，在IE7和IE8的帮助下，我在渲染相同的效果时遇到了问题

它对我需要的一些效果非常有效，但是CSS3的一个饼图是布局，更具体地说是在应用它的元素中，到目前为止，我只在IE7中遇到过这样的问题，IE8没有显示相同的问题

我问如果有人知道如何解决这个问题，我想保持它的简单，只使用CSS来解决这样的问题，我认为可能需要一个不受CSS限制的不同方法，这就是为什么我寻求帮助

<style type="text/css" media="screen,projection">
#centerContainer {
        width:940px;
        margin-top:76px; /* without effect in the layout when CSS3 Pie is applyed */
        min-height:200px;
        margin-left:auto;
        margin-right:auto;
        margin-bottom:60px;
        background-color:#FF6;
        -webkit-border-radius: 6px;
        -moz-border-radius: 6px;
        border-radius: 6px;
        -moz-box-shadow: 0px 0px 10px #000;
        -webkit-box-shadow: 0px 0px 10px #000;
        box-shadow: 0px 0px 10px #000;
}

.css3pie { 
        behavior: url(http://localhost:999/css/PIE.htc)\9;
}
/*Note the "\9" is to limit this CSS property to IE 8 and lower since I didn't noticed the need for CSS3 Pie in IE 9 and above */
</style>


<div id="centerContainer" class="css3pie">
</div>

#中心容器{
宽度：940px；
边距顶部：76px；/*在应用CSS3饼图时在布局中不起作用*/
最小高度：200px；
左边距：自动；
右边距：自动；
边缘底部：60px；
背景色：#FF6；
-webkit边界半径：6px；
-moz边界半径：6px；
边界半径：6px；
-moz盒阴影：0px 0px 10px#000；
-网络工具包盒阴影：0px 0px 10px#000；
盒影：0px 0px 10px#000；
}
.css3pie{
行为：url(http://localhost:999/css/PIE.htc)\9;
}
/*注意“\9”是将这个CSS属性限制在IE8及更低版本，因为我没有注意到IE9及更高版本中需要CSS3饼图*/

---

欢迎提出解决方案和建议。多谢各位

我在centerContainer div周围使用了一个wrapper div，并将wrapper div设置为padding top，该值与margin top centerContainer div的值相同

<style type="text/css" media="screen,projection">
#wrapper {
        paddin-top:76px;
/* same effect as the margin-top:76px; in the centerContainer */
}
#centerContainer {
        width:940px;
        min-height:200px;
        margin-left:auto;
        margin-right:auto;
        margin-bottom:60px;
        background-color:#FF6;
        -webkit-border-radius: 6px;
        -moz-border-radius: 6px;
        border-radius: 6px;
        -moz-box-shadow: 0px 0px 10px #000;
        -webkit-box-shadow: 0px 0px 10px #000;
        box-shadow: 0px 0px 10px #000;
}

.css3pie { 
        behavior: url(http://localhost:999/css/PIE.htc)\9;
}
/*Note the "\9" is to limit this CSS property to IE 8 and lower since I didn't noticed the need for CSS3 Pie in IE 9 and above */
</style>

<div id="wrapper">
    <div id="centerContainer" class="css3pie">
    </div>
</div>

#包装纸{
帕丁顶：76px；
/*与centerContainer中的页边距顶部效果相同：76px*/
}
#中心容器{
宽度：940px；
最小高度：200px；
左边距：自动；
右边距：自动；
边缘底部：60px；
背景色：#FF6；
-webkit边界半径：6px；
-moz边界半径：6px；
边界半径：6px；
-moz盒阴影：0px 0px 10px#000；
-网络工具包盒阴影：0px 0px 10px#000；
盒影：0px 0px 10px#000；
}
.css3pie{
行为：url(http://localhost:999/css/PIE.htc)\9;
}
/*注意“\9”是将这个CSS属性限制在IE8及更低版本，因为我没有注意到IE9及更高版本中需要CSS3饼图*/