css 絕對定位的元素在 ie6 下不顯示

2021-09-06 15:52:25 字數 1888 閱讀 4390

問題描述:

在 ie6 中如果乙個浮動元素與絕對定位元素相鄰的話,在某些情況下絕對定位元素將會消失。

產生原因:

只有當絕對定位元素的鄰近浮動元素的寬度大於父層寬度減 3 時(即如果父層寬度是 300px,浮動元素的寬度大於 297px),該絕對定位元素在 ie6 下面會隱藏。

html:

doctype html

>

<

html

lang

="en"

>

<

head

>

<

meta

charset

="utf-8"

/>

<

title

>絕對定位的元素在ie6下不顯示

title

>

head

>

<

body

>

<

div

class

="w"

>

<

div

class

="fl"

>浮動元素

div>

<

div

class

="pa"

>絕對定位元素

div>

div>

body

>

html

>

css:

.w.pa.fl
ie6 瀏覽器效果:

其他瀏覽器效果:

解決方法:

1、調整浮動元素的寬度,即寬度小於或等於父層寬度減 3;

2、在浮動元素與絕對定位元素之間新增乙個空的 div(推薦)。

還是以上面的例項為參考:

doctype html

>

<

html

lang

="en"

>

<

head

>

<

meta

charset

="utf-8"

/>

<

title

>絕對定位的元素在ie6下不顯示

title

>

head

>

<

body

>

<

div

class

="w"

>

<

div

class

="fl"

>浮動元素

div>

<

div>

div>

<

div

class

="pa"

>絕對定位元素

div>

div>

body

>

html

>

ie6 瀏覽器和其他瀏覽器效果:

css 絕對定位的元素在ie6下不顯示

問題描述 在 ie6 中如果乙個浮動元素與絕對定位元素相鄰的話,在某些情況下絕對定位元素將會消失。產生原因 只有當絕對定位元素的鄰近浮動元素的寬度大於父層寬度減 3 時 即如果父層寬度是 300px,浮動元素的寬度大於 297px 該絕對定位元素在 ie6 下面會隱藏。html doctype ht...

css 絕對定位的元素在 ie6 下不顯示

問題描述 在 ie6 中如果乙個浮動元素與絕對定位元素相鄰的話,在某些情況下絕對定位元素將會消失。產生原因 只有當絕對定位元素的鄰近浮動元素的寬度大於父層寬度減 3 時 即如果父層寬度是 300px,浮動元素的寬度大於 297px 該絕對定位元素在 ie6 下面會隱藏。html doctype ht...

絕對定位的元素在IE6下莫名丟失解決辦法

前幾天做春運的頁面時遇到的乙個問題.下面為形成此問題的 style wrap box test1 test2 style div class wrap div class box 123456789 div div class test1 abc div div class test2 def di...