爲什麼z-index：99999999999;禁用內聯樣式定義？

Question

Acording到：mozilla.org

CSS匹配的優先級如下：

• 通用選擇
• 類型選擇
• 類選擇
• 屬性選擇器
• 僞類
• ID選擇器
• 內嵌樣式

CSS代碼：

body div#redDiv.myClass{ 
    position:absolute; 
    top:10px; 
    left:10px; 
    width:10px; 
    height:10px; 
    background-color:red; 
    z-index:99999999999; 
} 
#blueDiv{ 
    position:absolute; 
    top:15px; 
    left:15px; 
    width:10px; 
    height:10px; 
    background-color:blue; 
} 

HTML：

<div id="blueDiv" style="z-index:99999999999;"></div> 
<div id="redDiv" class="myClass" style="z-index:99999999998;"></div> 

因此給予2個的div，redDiv和blueDiv其中：

• redDiv有CSS定義使用body id和class selector的組合具有z-index支撐erty設置爲「99999999999」，但有一個內聯定義，應該將其css覆蓋爲「99999999998」
• blueDiv將內聯css設置爲「99999999999」。

預期的行爲應該是redDiv上方的blueDiv，但是會發生相反的情況，它幾乎就像覆蓋沒有完成！但是，如果值較小，如「99」和「98」，blueDiv高於redDiv（http://jsfiddle.net/9U2fU/1/）。

任何人都可以指出可能是什麼問題？

我無法更改redDiv的原始CSS，所以我需要通過添加內聯樣式定義來解決問題。

JSFiddle example of wrong override

Answer 1

我要帶刺這一點，並同意上司的評價。你的數字大於一個32位的整數，我敢肯定，最大的z-index，不管怎麼說，都小於這個數字，可能是你的問題的原因，但我沒有測試它。嘗試減少它到... 9，看看會發生什麼。