爲什麼我的佈局僅在Firefox和IE8（而不是9）中打破？

Question

我今天注意到，我幾個月前完成的一個網站在Firefox和IE8上表現不佳（在IE9中工作正常）。現在已經很老了，我很確定當時我測試了瀏覽器的兼容性，但我想有人會犯錯誤。

問題是我似乎無法理解問題。基本上我有一個左側浮動側邊欄的固定位置，但它呈現在右邊（在它的容器外）FF和IE8。我總是可以從頭開始重新構建佈局（它使用Skeleton Grid系統），但仍然想要了解問題。

Example page that's broken on the website.

嘗試與不同的瀏覽器打開它，看看自己。另外，如果有人在FF上看到它，我也很感興趣。

非常感謝！

編輯：我不是要求整個調試。只要有人知道這個問題。

編輯2：驗證器鏈接在這裏是不相關的。我已經檢查過它們，它們基本上是用於html的CSS和CMS相關的前綴。

EDIT3：我固定它，並準備了還挺完整的答案後，但因爲我是一個新用戶，我不能回答我的問題在接下來的7小時... ...所以在這裏，它是：

我剛剛從你的答案中提出了一些提示（謝謝 你！）。

基本上，這與瀏覽器如何處理固定元素上的浮點數有關。想象一下，我們正在處理連續的「浮動：左」 元素，這是大多數網格系統（960gs，bootstrap， 等）的情況。

這裏的瀏覽器將如何處理沒有固定 定位這些元素：http://jsfiddle.net/cPjdK/並與浮動：正確的： http://jsfiddle.net/cPjdK/1/

現在，如果我們有一個很長的第三列，並希望將第一 （我的例子） ？那麼它基本上禁用浮點數，因爲固定的 元素超出流程。 http://jsfiddle.net/cPjdK/9/

所以，你必須絕對（或在我的情況下邊距） http://jsfiddle.net/cPjdK/6/

現在來談談我的網站定位呢？固定的元素已經浮動了，整個電網系統有點崩潰。解決這似乎是一個 長時間的工作。但是，出於某種原因，用「float：right」替換浮動元素上的「float：left」屬性 基本上解決了它。爲什麼 修復它？爲什麼它不適用於FF和IE8，但在IE9 和Chrome上顯得很好。

我不知道。

但現在看起來罰款（後一些調整），我已經付出了這麼 ...

問題解決了，但問題的答覆，對不起...

Answer 1

你有一個FIXED定位元素，但沒有給它任何座標。

先給它是這樣的：

#side-right{ 
position:fixed; 
top:0; 
left:0; 
}