DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> CSS詳解 >> IE與Firefox下對CSS解析的區別(3)
IE與Firefox下對CSS解析的區別(3)
編輯:CSS詳解     

5、深入標准~TheIEDoubledFloat-MarginBug(IE雙倍浮動邊界Bug)

什麼發生故障?

一段無錯的代碼把一個居左浮動(float:left)的元素放置進一個容器盒(box),並在浮動元素上使用了左邊界(margin-left)來令它和容器的左邊產生一段距離。看起來相當的簡單,對嗎?但直至它被在IE/Win中浏覽為止,在浏覽器中居左浮動元素的邊界長度被神秘地翻了一倍!

情況應該如何?

下面的圖釋展示了一個簡單的div(茶色的盒子)包含著一個居左浮動的div(綠色的盒子)。浮動元素有一個100px的左邊界,使容器盒與它的左邊緣之間產生了一個100px的間隙。到現在為止,一直都還不錯。

  1. .floatbox{
  2. float:left;
  3. width:150px;
  4. height:150px;
  5. margin:5px05px100px;
  6. /*ThislastvalueapplIEsthe100pxleftmargin*/
  7. }
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved