Hi,
Die Styles von rols haben noch folgende Fehler:
- Höhe des menue-divs ist fälschlicherweise 100%, 80% wären richtig.
- im Mozilla ist der Defaultwert für den Body-margin 8px, dies ist zu berücksichtigen, da mit einer Menühöhe von 80%, einer top-Höhe von 20% und 2*8px Body-margin die 100% immer überschritten sind. Lösung: margin:0; für den body.
- das Inhalts-div ist nicht geschlossen.
Dann ist's auch im Mozilla super.
Danke für die Korrekturen! Das mit dem default-margin des Mozilla wußte ich nicht, den Rest hätte ich auch selbst merken können. Hier also die aktuelle Version:
---------------------------------------------------------------------------------
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml" />
<title>Fixierte Navigation ohne Frames und Scripting</title>
<style type="text/css">
html, body {height:100%; overflow:hidden; margin:0; }
.inhalt { background:rgb(240,240,240);
position:absolute; left:25%; top:20%; width:75%; height:80%; overflow:auto; }
.menue { position:absolute; left:0%; top:20%; width:25%; height:80%; overflow:auto;
background:rgb(100,100,200); }
.top { background:rgb(255,255,200); text-align:center;
position:absolute; left:0%; top:0%; width:100%; height:20%; overflow:auto; }
</style>
</head>
<body>
<div class="top">
Minimalbeispiel zur Realisation eines frameartigen Layouts mit fixierter Navigation
neben scrollbaren Inhalten in reinem CSS. Das Konzept wurde vorgeschlagen von Klaus B.
in <a href="http://forum.de.selfhtml.org/?t=72601&m=418246">diesem Thread</a> des
<a href="http://forum.de.selfhtml.org/">SELFHTML Forums</a>.
</div>
<div class="menue">
<a href="fixnav.html">Erste Seite</a><br>
Zweite Seite<br>
Dritte Seite<br>
</div>
<div class="inhalt">
Franz jagt im komplett verwahrlosten Taxi quer durch Bayern.
Franz jagt im komplett verwahrlosten Taxi quer durch Bayern.
</div>
</body>
</html>
---------------------------------------------------------------------------------
Bei mir super Darstellung in IE6, NS7.1, Mozilla FireFox und Opera 7.22, aber so was von gut...!
Gruß
Roland