Virker i Netscape, Opera og Firefox men ikke IE 7
HejNedenstående kode virker perfekt i Opera, Netscape og Firefox. Men i IE 7 skjuler den ikke den nederste div (den hvor der står Blok 2 i)
Jeg var så letsindig at "opgradere" IE 6 til version 7, beta 2. Derfor kan jeg ikke teste med IE 6. Er der en der vil være så flink?
Desuden er jeg interesseret i at høre om der er andre der er stødt på tilsvarende problem. Jeg ved godt det er en beta-version, men man vil jo gerne vær elidt på forkant :)
På forhånd tak
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/strict.dtd" />
<html>
<head>
<style>
html,body {
height:100%;
margin:0;
padding:0;
}
#blok1.shown {
height:50%;
background:green;
}
#blok1.hidden {
height:100%;
}
#blok2.shown {
height:50%;
background:yellow;
}
#blok2.hidden {
display:none;
background:yellow;
}
</style>
<meta http-equiv="Content-Type" content="text/html; CHARSET=ISO-8859-1" />
<script>
function toggleHelp() {
if(document.getElementById('blok1').className == 'shown') {
document.getElementById('blok1').className = 'hidden';
document.getElementById('blok2').className = 'hidden';
} else {
document.getElementById('blok1').className = 'shown';
document.getElementById('blok2').className = 'shown';
}
}
</script>
</head>
<body>
<div style="width:200px;float:left;background:blue;height:100%">
<div id="blok1" class="shown">
<div style="height:100%">
-menu 1<br>
-menu 1<br>
-menu 1<br>
-menu 1<br>
</div>
<div style="position:relative;top:-25px;">
<button onclick="toggleHelp()">Vis/skjul hjælp</button>
</div>
</div>
<div id="blok2" class="shown">Blok 2</div>
</div>
<div style="background:red;height:100%">
Blok 3
</div>
</body>
</html>