Question

我创建了一个图像库，可以正确呈现除IE7以外的所有地方 - http://ianespinoza.com/。

我使用以下结构：

<!-- this div is the overall container for the carousel -->
<div id="carouselContainer">
   <!-- this div contains all the thumbs and this div is animated to slide. -->
   <div id="thumbContrainer">
      <ul class="thumb">
         <!-- Img 1 -->
         <li>...</li>
         etc....
      </ul
   </div>
</div>

这是应用于这些元素的样式：

#carouselContainer {
width:934px;
height:145px;
border:none;
overflow:hidden;
position:relative; 
left:40px;
top:5px;}


#thumbContrainer { 
position:relative; 
left:20px;
height:110px;
margin:30px 0px; 
width:5000px;
border:none;}

ul.thumb {
list-style: none;
margin: 0; 
padding: 0px;}

所有浏览器都能正确呈现，IE7除外。

在IE 7 div中，“thumbContrainer”没有上边距，但我确实需要这个边距。

Answer 1

尝试将margin替换为padding中的#thumbContrainer：

#thumbContrainer{ 
    position:relative; 
    left:20px;
    height:110px;
    padding:30px 0px; 
    width:5000px;
    border:none;
}

Answer 2

感谢所有的答案和建议。

实际上我最终解决IE7问题的方法是给父元素 - “carouselContainer”填充，并删除“thumbContrainer”的边距。

虽然它解决了这个问题，但仍然不确定原来的设置是什么，即使使用* margin-top也无济于事。

IE7没有保证金

2 个答案: