IE8圖像大於div，相對/絕對和負邊距

Question

所以這裏是我的HTML代碼有問題。

<script type="text/css"> 
    .slider-holder { 
     background-color:transparent; 
     } 

    .slider-bg { 
     min-height: 295px; 
     position: relative; 
     z-index: 1; 
     border-bottom:0px; 

     } 

    .slider { 
     height: 295px; 
     padding: 1px 17px 0; 
     margin: 0 auto; 
     position: relative; 
     background: transparent; 

    } 

    .slider .items, 
    .slider .items2 { 
     position: relative; 
     height: 293px; 
     float: left; 
    } 

    .slider .items div.item, 
    .slider .items2 div.item{ 
     height: 293px; 
     display: none; 
     position: absolute; 
     top: 0; 
     left: 0; 
     z-index: 0; 
    } 

    .slider .slider-text { 
     width: 720px; 
     position: relative; 
     z-index: 2; 
     padding: 70px 0 0; 
    } 

    .slider .slider-text, .slider .slider-text p { 
     background-color: inherit; 
     color: #fff; 
     font-size: 32px; 
     line-height: 33px; 
    } 

    .slider .slider-text.smaller p 
     { 
     font-size:24px; 
     } 

    .slider .slider-text p { padding: 0 0 10px; } 

    .slider .slider-text a.slider-btn { 
     background: #58940a url('img/btn/slider-btn.png') no-repeat 8px 7px; 
     display: block; 
     float: left; 
     -webkit-border-radius: 1px; 
     -moz-border-radius: 1px; 
     border-radius: 1px; 
     -webkit-box-shadow: 0px 0px 40px #666; 
     -moz-box-shadow: 0px 0px 40px #666; 
     box-shadow: 0px 0px 40px #666; 
     padding: 6px 10px 6px 32px; 
     color: #fff; 
     font-size: 15px; 
     line-height: 20px; 
     height: 20px; 
    } 

    .slider .slider-img { 
     position: absolute; 
     bottom: 0px; 
     padding: 0 5px 0 0; 
     z-index: 1; 
     left:-312px; 
     zoom: 1; 

    } 

    .slider .slidetabs { 
     position: absolute; 
     left:375px; 
     bottom: 27px; 
     z-index: 3; 
    } 

    .slider .slidetabs a { 
     background: url('img/elem/thumbnail-disc.png') no-repeat left top; 
     display: block; 
     width: 11px; 
     height: 11px; 
     float: left; 
     margin: 0 6px 0 0; 
    } 

    .slider .slidetabs a:hover, .slider .slidetabs a.current { background-position: left bottom; } 
</script> 

<div class="slider-holder"> 
    <div class="slider-bg"> 
     <!--begin:slider--> 
     <div class="slider"> 
      <div class="items"> 
       <!--begin:item--> 
       <div class="item" style="display: none; "> 
        <div class="slider-text"></div> 
        <div class="slider-img"> 
         <img src="image.jpg" alt="" width="1600" height="294" align="center"> 
        </div> 
       </div> 
       <!--end:item--> 
       <!--begin:item--> 
       <div class="item" style="display: none; "> 
        <div class="slider-text smaller"></div> 
        <div class="slider-img"> 
         <img src="image2.jpg" alt="" width="1600" height="294" align="center"> 
        </div> 
       </div> 
       <!--end:item--> 
       <!--begin:item--> 
       <div class="item" style="display: block; "> 
        <div class="slider-text"></div> 
        <div class="slider-img"> 
         <a href="http://www.link.com" target="_blank"> 
          <img src="image.jpeg" alt="" width="1600" height="294" align="center"> 
         </a> 
        </div> 
       </div> 
       <!--end:item--> 
      </div> 
      <div class="slidetabs"> 
       <a href="#" class=""></a> 
       <a href="#" class=""></a> 
       <a href="#" class="current"></a> 
      </div> 
     </div> 
     <!--end:slider--> 
    </div> 
</div> 

與此特定設置的問題是，IMG是比格（這是故意的大。而這種設置除了IE8最browswers的作品。它能夠在.slider持有人盒切斷（或至少看起來是這樣）

Answer 1

發現一個緩存插件正在破解該網站，繼續進行下去