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中

回答

相關問題