IE下css常見的問題

2021-09-01 10:01:24 字數 954 閱讀 2566

1、雙邊距問題

#mydiv{

float: left

margin-left: 100px

在ie6下這個div的左邊距和普通的瀏覽器不同,他會是200px

修復這個問題:

加乙個屬性  display:inline;

2、ie下面的haslayout問題

div#box{

background: red;

filter:aplpha(opacity=50);

opacity:0.5;

test

ie6\7下面div是沒有haslayout,沒有它,那麼濾鏡就不會起作用

預設沒有haslayout屬性的dom節點 

div,span

我們可以用css屬性來啟用元素的haslayout

•position

•float

•width(!auto)

•height(!auto)

•zoom

•overflow

div#box{

background: red;

filter:aplpha(opacity=50);

opacity:0.5;

height: 20px; /**讓haslayout起作用*/

3、ie6\7不支援display:inline-block的顯示方式

修復這個問題可以通過單獨對ie6\7設定一些屬性

div#box{

display:

inline-block;

*display:inline;

*zoom:1;

4、注意元素的margin重疊問題

•水平margin不重疊

•浮動元素上下margin不重疊(float)

•飄動元素上下margin不重疊(position)

•常規折行上下margin重疊

ie下常見的css相容問題

1.border radius 邊框圓角 ie8及以下瀏覽器不支援border radius webkit引擎支援 webkit borderradius 私有屬性 mozilla gecko引擎支援 moz border radius 私有屬性 presto 引擎和ie9 支援border rad...

IE下css常見問題總結及解決

1 div的垂直居中問題 解決方法 將行距增加到和整個div一樣高 複製 如下 div test 2 margin加倍的問題 ie6下,div設定為float時,左 右 margin會加倍。解決方法 在這個div裡面加上display inline 例如 3 ie6下頁面min width heig...

IE下css常見問題總結及解決

本文整理了ie中div的垂直居中問題 margin加倍的問題 ie6下頁面min width height與max width height問題 ie6 3px bug及ie6捉迷藏的問題等等,感興趣的朋友可以參考下哈 1 div的垂直居中問題 解決方法 將行距增加到和整個div一樣高 複製 如下 ...