2 svar · 301 visningar · startad av oola
#innehall {
float: left;
width: 600px;
padding: 0px;
margin: 0 0 0 0;
}
#innehall img {
border: 1px solid #828282;
padding: 0px;
margin: 10px;
}
#innehall img:hover {
border: 1px solid #FF0000;
padding: 0px;
margin: 10px;
}
Så ser mallen ut och hover effekten funkar finfint i firefox men inte i IE. Finns det ett sätt att komma runt det?
Sidan finns på:
Re: hover-effekt funkar ej i IE
hover effekten funkar finfint i firefox men inte i IE.
Jupp - det är ett sorgligt faktum att MSIE bara hanterar hover på <a>-taggar...
Finns det ett sätt att komma runt det?
Jadå - eftersom varje bild på din sida ligger i en <a>-tagg så finns det minst en möjlighet ;)
... och här är ett kanske lite annorlunda förslag som helt enkelt lägger till en <style>-tagg med ett "MSIE-hack" inom "villkorliga kommentarer" (som ju bara stöds av MSIE ;) ) till en sida med liknande upplägg som din.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="sv" xml:lang="sv">
<head>
<title>Ett exempel</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
.testarea img {border:4px solid black}
.testarea img:hover {border: 4px solid red}
</style>
<!--[if IE]>
<style type="text/css">
.testarea a {display:inline-block; border:4px solid black}
.testarea a img {border: none}
.testarea a:hover {border: 4px solid red}
</style>
<![endif]-->
</head>
<body>
<div class="testarea">
<a href="#"><img src="testbild3.gif" alt="En bild med en ram" /></a>
</div>
</body>
</html>
Provkör: http://member.webforum.nu/2241/img_hover.html :birp
Ser ut att kunna vara lösningen på mitt problem :)
Ska testa när jag kommer hem ikväll! Sätter ditt svar som slutgiltigt så länge.