如何讓這些CSS絕對位置在IE中工作？

請看下面的代碼。如果您查看身體圖，每種顏色代表右側的不同內容。但是，這些鏈接在IE中不起作用，我認爲是由於我寫的CSS。如何讓這些CSS絕對位置在IE中工作？

誰能闡明我如何在IE中複製這個？

HTML：

<div id="male"> 
    <img src="male1.png" alt="male1 Compensation Calculator" title="male" width="130" height="300" class="alignleft size-full wp-image-117" /></p> 
    <div class="head"><span class="whole fakelink"></span></div> 
    <div class="neck"><span class="whole fakelink"></span></div> 
    <div class="arm1"><span class="whole fakelink"></span></div> 
    <div class="arm2"><span class="whole fakelink"></span></div> 
    <div class="torso"><span class="whole fakelink"></span></div> 
    <div class="legs"><span class="whole fakelink"></span></div> 
</div>

CSS：

div.head { 
    position: absolute; 
    width: 70px; 
    margin-left: 31px; 
    height: 70px; 
} 
div.neck { 
    position: absolute; 
    height: 6px; 
    width: 18px; 
    margin: 70px 0px 0px 56px; 
} 
div.arm1 { 
    position: absolute; 
    height: 105px; 
    width: 30px; 
    margin: 77px 0px 0px 100px; 
} 
div.arm2 { 
    position: absolute; 
    height: 105px; 
    width: 30px; 
    margin: 77px 0px 0px 0px; 
} 
div.torso { 
    position: absolute; 
    height: 118px; 
    width: 70px; 
    margin: 77px 0px 0px 31px; 
} 
div.legs { 
    position: absolute; 
    height: 105px; 
    width: 69px; 
    margin: 195px 0px 0px 31px; 
} 
.whole { 
    width:100%; 
    height:100%; 
    display:block; 
} 
.fakelink { 
    color:white; 
    font-weight:bold; 
} 
.fakelink:hover { 
    cursor: pointer; 
    text-decoration:none; 
}

來源

2011-12-10 manc

哪個版本ie ie有問題7 8或9 – defau1t

定義「不工作」。有什麼事情發生？我唯一看到錯誤的是你正在關閉似乎不存在的'p'元素。順便說一下，在CSS中使用0時，不必指定單位。任何單位中的0將總是與任何其他單位中的0相同。但當然這不是問題。 :) –

舊版本的IE確實存在絕對位置問題，是的。如果你必須支持它，這裏有一篇文章可能會有所幫助：http://www.nixsoft.co.uk/index.php?file=/articles/absolute-fudge.page –

我知道只有兩種解決方案來解決這個問題，但他們都最終歸結爲需要背景：

選項1
在.fakelink上設置一個不透明的background-color。雖然很明顯在你的情況下這不會很有幫助，但它將說明需要一個背景。

如果你只需要支持IE9，我會建議使用RGBA具有低alpha透明度：

.fakelink{ background-colour: rgba(255,255,255,0.01) }

選項2
使用小透明的PNG或.gif和瓷磚它作爲background-image爲.fakelink

來源

2011-12-10 12:48:19 tw16

感謝您的解決方案！我需要支持儘可能多的IE版本，因此使用了可以工作的選項2！ – manc

如何讓這些CSS絕對位置在IE中工作？

回答

相關問題