nicht angemeldet
Hallo,
meine erste Frage hier in diesem Forum, bitte Nachsicht. Folgender Code wird im IE7 (im Gegensatz zu Mozilla Firefox) nicht so angezeigt, wie ich mich das wünsche. Die linke und rechte Navigationsleiste sollten parallel vom oberen zum unteren Rand des root-layers verlaufen. Ich war nicht in der Lage, in Selfhtml die Antwort zu finden.
Vielen Dank,
Christopher.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title></title>
<style type="text/css">
BODY {font-family:"Century Gothic"; font-size:11;text-align:center;margin:0;padding:1em 0;}
P {font-family:"Century Gothic"; font-size:11;}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
a:active {
text-decoration: none;
}
FORM {margin:0;padding:0;}
#root {margin:0 auto;text-align:left;padding:0;width:959px;border: 2px ridge silver;}
ul#Navigation {
float:left;
margin-left:0;margin-top:0;
font-size: 0.83em;
width: 179px;
margin: 0 0 0 0; padding: 0;background-color:#EAF5F9;
border: 1px dashed silver;
}
ul#Navigation li {
list-style: none;
margin: 0 auto; padding: 0.5em;
}
ul#Navigation li.first {
margin-top:200px;
}
ul#Navigation a {
color:#003366;
display: block;
padding: 0.2em;
font-weight: bold;
}
ul#Navigation a:hover,ul#Navigation a:active {
color: #FFF;
background-color: #003366;
}
ul#Navigationrechts {
margin: 0 0 1em 780px;
font-size: 0.83em;
width: 179px;
padding: 0;
background-color:#EAF5F9;
border: 1px dashed silver;
}
ul#Navigationrechts li {
list-style: none;
margin: 0 auto; padding: 0.5em;
}
ul#Navigationrechts a {
color:#003366;
display: block;
padding: 0.2em;
font-weight: bold;
}
ul#Navigationrechts a:hover,ul#Navigation a:active {
color: #FFF;
background-color: #003366;
}
ul#Navigationrechts li.first {
margin-top:200px;
}
#graphicfieldtop {float:left;position:relative;left:34px;width:529;height:205;}
</style>
</head>
<body>
<div id="root">
<!--<div id="navbarleft"> testtext-->
<ul id="Navigation">
<li class="first"><a href="">Einführung in CSS-basierte Layouts</a></li>
<li><a href="">Mehrspaltige CSS-basierte Layouts</a></li>
<li><a href="">Fixe Bereiche mit CSS-basierten Layouts</a></li>
<li><a href="">CSS-basierte Navigationsleisten</a></li>
<li><a href="">CSS-Browserweichen</a></li>
</ul>
<div id="graphicfieldtop"><img src="" alt="Top-Image" width="529" height="205" /></div>
<!--</div>-->
<ul id="Navigationrechts">
<li class="first">Einführung in CSS-basierte Layouts</li>
<li>Mehrspaltige CSS-basierte Layouts</li>
<li>Fixe Bereiche mit CSS-basierten Layouts</li>
<li>CSS-basierte
Navigationsleisten</li>
<li>CSS-Browserweichen</li>
</ul>
</div>
</body>
</html>