CSS在IE中工作，但不在Chrome中

我的CSS for Modal Popup扩展器在Chrome中不起作用，但它在IE中完美工作。CSS在IE中工作，但不在Chrome中

这里是我的CSS：

.modalBackground 
{ 
    background-color:#250517; 
    opacity:0.5; 
    filter: alpha(opacity = 50); 
} 

.modalPopup 
{ 
     background-color:White; 
     border-width:3px; 
     border-style:solid; 
     border-color:Black; 
     padding:3px; 
     width:250px; 
     height:300px; 

}

这是IE浏览器的截图，其中CSS工作完美：

这是Chrome浏览器的截图，其中CSS不起作用：

来源

2012-08-05 user484458

1st截图是IE浏览器在其中CSS完美工作。 – user484458 2012-08-05 01:18:47

应用CSS对于该模式弹出窗口如何显示。您可以在Chrome的开发工具中查看应用的CSS？我特别感兴趣的是为什么'height：300px'值不适用... – 2012-08-05 01:19:09

第二个是CSS不工作的chrome。 – user484458 2012-08-05 01:19:10

.modalBackground { 
    background: #250517; 
    opacity: 0.5; 
    filter: alpha(opacity=50); 
} 

.modalPopup { 
    background: #FFF; 
    border: solid 3px #000; 
    display: block; 
    padding: 3px; 
    width: 250px; 
    height: 300px; 
}

来源

2012-08-05 01:20:41

您能否描述问题以及您为解决问题所做的事情（因此我们不必注意差异）？无论如何，看起来你添加了'display：block;'......可能不会有所作为。 – Ryan 2012-08-05 01:21:40

'display：block;'会有所作为，因为它会强制元素符合设定的宽度和高度。另外，他在Chrome中的边框是灰色的，而不是黑色，因为他把'border-color：Black'（注意大写“B”）。 – 2012-08-05 01:25:12

@ChrisClower如果模态窗口不是块级别，高度也不适用于IE，但它确实如此。顺便说一句，CSS代码是*不*区分大小写 - 浏览器明白'黑色'罚款。你甚至可以像这样编写CSS - “bOdY {cOlOr：ReD; }' - ** demo：** http://jsfiddle.net/mksmW/'：）' – 2012-08-05 01:27:43

看，对于这样的事情...真的没有重新发明车轮的意义。

我强烈推荐一个久经考验的插件，它保证了跨浏览器和可靠。你会省下很多时间和精力。

尝试太极拳（一个jQuery插件）： http://www.shadowbox-js.com/

好运。

来源

2012-08-05 01:20:51

它在我的Chrome浏览器中工作正常。你可以看到它here或here。

您的Chrome可能不会更新。我尝试使用铬21。

来源

2012-08-05 01:30:53

问题是解决。有一个历史问题，其中存储了以前的值，这就是为什么它会产生问题。清除历史记录后，它的工作完美:) – user484458 2012-08-06 00:21:19

CSS在IE中工作，但不在Chrome中

回答

相关问题