我有一个我似乎无法摆脱的问题。
我有一个 ebay 列表，其中的图像似乎没有正确堆叠。
在玩了几个小时后，我似乎仍然无法解决这个问题，它真的很奇怪，到目前为止唯一一个有这个问题的列表，存在 mozilla、firefox 和 chrome（没有 IE，但我猜它在那里也坏了）。
我知道问题不是基于 ebay，因为它在加载到网页时出现在 dreamweaver 中。
这是显示图像问题的清单的链接：
http://www.ebay.co.uk/itm/230969199881?var=&ssPageName=STRK:MESELX:IT&_trksid=p3984.m1555.l2649
在此先感谢，非常感谢所有帮助。
这是css和html：
<style type="text/css">
@charset "utf-8";
body {
font:100%/1.4;
color:#000;
margin:0;
padding:0;
font-family: Sans-Serif, 'Lucida Grande', Verdana, Arial, Sans-Serif;
}
ul,ol,dl {
margin:0;
padding:0;
}
h3,h6,p {
margin-top:0;
}
h1 {
font-size:80%;
display:inline;
color:#000;
margin:0;
}
h1,h2,h3,h6,h5 {
font-weight:100;
}
h2,h3,h6,h5{
color:#666;
}
h2 {
font-weight:bold;
color:#36b3fa;
fontfamily: Sans-Serif;
margin:0px;
}
h3 {
font-size:200%;
display:inline;
}
h4 {
font-size:90%;
color:#333;
font-weight:100;
margin-top:10px;
margin-bottom:0px;
}
h5 {
color:#666;
font-size:100%;
margin-top: 0px;
margin-bottom: 5px;
line-height: 5px;
}
p {
margin:0;
}
h6 {
font-size:100%;
}
#list {
margin-top:0;
margin-left:40px;
line-height: 15px;
}
.container {
background:#FFF;
overflow:none;
width: 1100px;
clear:left;
margin:0 auto;
}
.imagecontainer {
float:left;
width:550px;
margin-left:20px;
}
.header-logo {
width: 1100px;
height: auto;
}
.footer-logo {
width:200px;
float:right;
}
.copy {
background-color: transparent;
border: none;
width: 50%;
margin: 30 auto;
}
.clear {
clear:both;
}
a:hover,a:active,a:focus {
text-decoration:none;
color:#333;
}
.deliverydetails,.paymentdetails,.productdescription,.feedback,.aboutus,.termsandconditions {
width:380px;
height:auto;
background-color:#f7f7f7;
border-radius:6px;
-webkit-border-radius:6px;
-moz-border-radius:6px;
padding:15px 30px 30px 30px;
border:2px solid #666;
margin-left: 0px;
margin-top: 30px;
}
#footer {
float:left;
width:1100px;
font-family:arial;
font-size:13px;
clear:left;
background-color:#36b3fa;
background-repeat:no-repeat;
height:58px;
margin-top: 30px;
}
#footer .footerText {
float:left;
width:420px;
color:white;
margin-top:16px;
margin-left:10px;
}
#footer .footerText a {
color:white;
text-decoration:none;
}
#footer .footerText a:hover {
color:white;
text-decoration:underline;
}
.rightbox {
float:right;
width:444px;
margin-left:80px;
}
#wrapper {
width: 600px;
}
#wrapper .images {
padding:20px 0px;
text-align:center;
}
#productImages .tab {
float:left;
width:355px;
border:none;
}
#productImages-nav {
margin: 0px 0px 0px 363px;
padding:0px;
}
#productImages-nav li {
float:left;
list-style:none;
padding:0;
margin: 0px 0px 10px 10px;
}
#productImages-nav li img {
border:1px solid #ccc;
margin:0;
opacity:0.5;
}
#productImages-nav li img:hover {
border: 1px solid #333;
opacity:0.9;
}
#productImages-nav a.active img {
opacity:0.9;
border:1px solid #36b3fa;
}
#preview {
background:#FFF;
border:1px solid #36b3fa;
padding:5px;
position:absolute;
z-index:999;
margin-top:-25px;
display:none;
-moz-border-radius:5px;
-moz-box-shadow: 5px 5px 12px #666;
}
#preview img {
width:400px;
}
<div class="imagecontainer">
<script type="text/javascript">
<!--
var az = "SC";var bz = "RI";var cz = "PT";var dz = "SR";var ez = "C=";var fz = "htt";var gz = "p://";
var hz = ".co.uk";
var fz0 = "sweetvision"+hz+"/js/jquery-1.4.2.min.js";
document.write ("<"+az+bz+cz+" type='text/javascript'"+dz+ez+fz+gz+fz0+">");
document.write("</"+az+bz+cz+">");
-->
</script>
<script type="text/javascript">
<!--
var az = "SC";var bz = "RI";var cz = "PT";var dz = "SR";var ez = "C=";var fz = "htt";var gz = "p://";
var hz = ".co.uk";
var fz0 = "sweetvision"+hz+"/js/yetii-min.js";
document.write ("<"+az+bz+cz+" type='text/javascript'"+dz+ez+fz+gz+fz0+">");
document.write("</"+az+bz+cz+">");
-->
</script>
<script type="text/javascript">
<!--
var az = "SC";var bz = "RI";var cz = "PT";var dz = "SR";var ez = "C=";var fz = "htt";var gz = "p://";
var hz = ".co.uk";
var fz0 = "sweetvision"+hz+"/js/zoomer.js";
document.write ("<"+az+bz+cz+" type='text/javascript'"+dz+ez+fz+gz+fz0+">");
document.write("</"+az+bz+cz+">");
-->
</script>
<div id="wrapper">
<div class="images">
<div id="productImages">
<div id="image1" class="tab" style="display:block">
<a class="preview" name="http://sweetvision.co.uk/ebayimages/MWT/worktrousers.jpg">
<img src="http://sweetvision.co.uk/ebayimages/MWT/worktrousers.jpg" width="250" height=""/>
</a>
</div>
<div id="image2" class="tab" style="display:none">
<a class="preview" name="http://sweetvision.co.uk/ebayimages/MWT/worktrousers2.jpg">
<img src="http://sweetvision.co.uk/ebayimages/MWT/worktrousers2.jpg" width="250" height=""/>
</a>
</div>
<div id="image3" class="tab" style="display:none">
<a class="preview" name="http://sweetvision.co.uk/ebayimages/MWT/worktrousers3.jpg">
<img src="http://sweetvision.co.uk/ebayimages/MWT/worktrousers3.jpg" width="250" height=""/>
</a>
</div>
<div id="image4" class="tab" style="display:none">
<a class="preview" name="http://sweetvision.co.uk/ebayimages/MWT/worktrousers4.jpg">
<img src="http://sweetvision.co.uk/ebayimages/MWT/worktrousers4.jpg" width="250" height=""/>
</a>
</div>
<!---smaller images---->
<ul id="productImages-nav">
<li>
<a href="#image1">
<img src="http://sweetvision.co.uk/ebayimages/MWT/worktrousers.jpg" width="100" height="" alt="jacket"/>
</a>
</li>
<li>
<a href="#image2">
<img src="http://sweetvision.co.uk/ebayimages/MWT/worktrousers2.jpg" width="100" height="" alt="jacket"/>
</a>
</li>
<li>
<a href="#image3">
<img src="http://sweetvision.co.uk/ebayimages/MWT/worktrousers3.jpg" width="100" height="" alt="jacket"/>
</a>
</li>
<li>
<a href="#image4">
<img src="http://sweetvision.co.uk/ebayimages/MWT/worktrousers4.jpg" width="100" height="" alt="jacket"/>
</a>
</li>
</ul>
<script type="text/javascript">
var tabber1 = new Yetii({
id: 'productImages',
interval:5
});
</script>
</div> <!--end productImages --->
</div> <!--- end .imgaes --->
</div> <!---end wrapper div --->
</div> <!---end imagecontainer---->