上海網頁設計公司如何解決IE雙邊距BUG
發布時間:2015-10-13
一、雙邊距是什么含義?
如上圖,綠色塊要求在藍色塊中向左浮動,并距藍色塊左邊距100像素。這樣的布局在美工網頁設計過程中經常用到。實現這樣的效果,一般使用如下css樣式:.floatbox { float: left; width: 150px; height: 150px; margin: 5px 0 5px 100px;},看上去似乎簡單,但是如果在IE6中瀏覽時會發現100的邊距變為200了。
二、這是為什么?
其實筆者也不清楚究竟什么原因,但它確實在ie6中存在。研究發現在元素浮動方向與浮動邊據一致時才會出現,上面的例子就是這樣。另外同一行如果有多個浮動元素,則只有至上個元素會出現bug。
三、怎樣避免這種情況
給浮動元素樣式加上display:inline就能解決問題。
標簽: 上海網頁設計 ,