2012-02-07 37 views
-1

这很奇怪,我有这个bug在IE8,而不是IE7,它精细显示出来:IE8漏洞 - 边界和宽度浮动图像

http://www.axiscirugiadecolumna.com/

我使用的是WordPress插件为阴影+功能区(我对shadow插件中的功能区进行了硬编码)。边框是简单的CSS,但在IE8的右边框将不会出现,我只是不知道为什么。

我的HTML如下:

<div class="alignright" style="overflow:hidden;display:table;line-height:0;text-align:center;width:453px;"> 
    <div class="ribboncontainer"> 
     <div class="ribbon"></div> 
     <img height="297" width="453" style="padding:0 !important; margin:0 !important; max-width:100% !important;" alt="" src="http://www.axiscirugiadecolumna.com/wp-content/uploads/2011/11/foto1.png" title="foto1" class=" size-full wp-image-143 shadow_curl"> 
     <br><img style="margin:0 !important;height:10px;width:100%;-moz-opacity:.75;opacity:.75;" class="shadow_img" src="http://www.axiscirugiadecolumna.com/wp-content/plugins/shadows/shadow_curl.png"> 
    </div> 
</div> 

这是应用插件后。内联样式由插件应用。

而且我的CSS:

.alignright, .aligncenter, .alignleft { 
    margin: 5px; 
    padding-right: 5px; 
    float: right; 
} 
.ribbon { 
    background-image: url("ribbon.png"); 
    bottom: 21px; 
    height: 40px; 
    position: absolute; 
    right: -5px; 
    width: 154px; 
    z-index: 888; 
} 
.ribboncontainer { 
    position: relative; 
} 
.shadow_curl { 
    border: 6px solid #BAD5BC;/*Right border is missing in IE*/ 
    } 

我认为这个问题仍然存在,即使我摆脱带状类和的div。

+0

你可以张贴实际的代码?这是一个社区,一旦你的代码被修复或者你的网站永远消失,未来这个问题的访问者将不知道发生了什么。 – 2012-02-07 09:33:29

+0

对不起,我想到了,我应该做到这一点。我不是懒惰或任何东西,将编辑我的问题。 – 2012-02-07 09:36:55

回答

0

卸下

max-width: 100%; 

style.css中(线894) img.size-汽车,img.size满,img.size-大,img.size介质,.attachment IMG

+0

外面有一个最大宽度它没有做任何事情:( – 2012-02-07 10:13:04

+0

检查:100%重要补充直列 – 2012-02-07 10:48:42

+0

不,我删除了来自世界各地,仍然一无所获:/ – 2012-02-07 11:11:46

0

好了,这是因为IE8(我还测试了在IE7页) - 两者不支持CSS规则“的box-shadow”,在文件的style.css(线171)。 如果你坚持使用阴影(我认为),你应该使用这些浏览器一个透明的PNG/GIF文件。请记住,IE6不支持本地png文件,因此最好使用gif。

+0

它不是一个箱阴影的问题,它的边界。影子在那里适用于现代浏览器,我不在乎它是否消失在IE上。图像下面的阴影是一个真实的图像。 – 2012-02-07 09:37:49