Nicht mehr ganz neu hier
Hallo zusammen,
es wäre super, wenn mir jemand hier kurz helfen könnte......
Ich bin dabei, mich näher mit html und css zu beschäftigen und arbeite momentan mit dem Buch Einstieg in CSS von Elisabeth Wetsch.
Da das Buch etwas älter ist, stolpere ich bei IE 9 über das Problem, dass ein Beispiel nicht richtig angezeigt wird.
Wie bringe ich IE 9 in diesem Fall dazu, mitzuspielen?
(der Rahmen oben dockt nicht an den Rand rechts an)
HTML:
CSS:
es wäre super, wenn mir jemand hier kurz helfen könnte......
Ich bin dabei, mich näher mit html und css zu beschäftigen und arbeite momentan mit dem Buch Einstieg in CSS von Elisabeth Wetsch.
Da das Buch etwas älter ist, stolpere ich bei IE 9 über das Problem, dass ein Beispiel nicht richtig angezeigt wird.
Wie bringe ich IE 9 in diesem Fall dazu, mitzuspielen?
(der Rahmen oben dockt nicht an den Rand rechts an)
HTML:
HTML:
<html>
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title></title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta name="author" content="Martina">
<meta name="editor" content="html-editor phase 5">
<link href="styles.css" rel="stylesheet" type="text/css" media="screen"/>
</head>
<body id="produkte">
<div id="rahmenoben"></div><!-- END #rahmenoben -->
<div id="nav">
<ul>
<li class="navhome"><a href="#"><span>home</span></a></li>
<li class="navteam"><a href="#"><span>team</span></a></li>
<li class="navprodukte"><a href="#"><span>produkte</span></a></li>
<li class="navservice"><a href="#"><span>service</span></a></li>
<li class="navkontakt"><a href="#"><span>kontakt</span></a></li>
</ul>
</div><!-- END #nav -->
<div id="rahmenlinks">
<div id="menu">
<ul>
<li><a href="#">Obst</a>
<ul>
<li class="aepfel"><a href="#">Äpfel</a></li>
<li class="birnen"><a href="#">Birnen</a></li>
<li class="kirschen"><a href="#">Kirschen</a></li>
</ul>
</li>
<li><a href="#">Gemüse</a>
<ul>
<li class="tomaten"><a href="#">Tomaten</a></li>
<li class="gurken"><a href="#">Gurken</a></li>
<li class="spinat"><a href="#">Spinat</a></li>
</ul>
</li>
</ul>
</div><!-- END #menu -->
</div><!-- END #rahmenlinks -->
<div id="hauptrahmen">
<div id="maintext">
<h1>Webhome Modell "Frames" oben</h1>
<p>Cassie will be competing at the US Covergirl Classic this weekend on July 24 in Chicago, Illinois. She will be in the senior session at 7:00 p.m. at the UIC Pavilion. Cassie has already qualified for the VISA Championships in Hartford, CT. She will use this competition as a warm up. The Universal Sports will be broadcasting the US Covergirl Classic live. You can find more information by going to UniversalSports.Com. Good luck Cassie!</p>
</div><!-- END #maintext -->
</div><!-- END #hauptrahmen -->
</body>
</html>
CSS:
Code:
html {/*height: 100.1%; */ font-size: 62.5%; overflow: hidden;}
body {font: 1.2em/1.8em Verdana, sans-serif; height: 100%; max-height: 100%;}
* {margin: 0px; padding: 0px; border: 0px;}
h1, h2, h3, h4, h5, h6 {font-family: "Century Gothic", sans-serif; margin: 0em 0em 0.5em 0em; color: #004A7F;}
h1 {font-size: 2.2em; border-bottom: 1px dashed #004A7F; padding-bottom: 0.4em; font-weight: normal;}
div#header h1 {border: 0px;}
h2 {font-size: 2.0em;}
h3 {font-size: 1.8em;}
h4 {font-size: 1.6em;}
h5 {font-size: 1.4em;}
h6 {font-size: 1.2em;}
a {color: #E3004F; text-decoration: none;}
a:link {}
a:visited {}
a:hover {}
a:active {}
div#nav {position: absolute; top: 100px; right: 0px; width: auto; text-align: right; background: #DEDEDE; padding-right: 20px; z-index: 100;}
div#nav li {display: inline; margin-left: 0.4em;}
div#nav a {text-decoration: none; font-weight: bold; text-transform: uppercase;}
div#nav a span {padding: 0.4em 1.0em 0.6em 1.0em; border: 1px solid #CCCCCC; border-bottom: 1px solid #FFFFFF; background: #FFFFFF;}
div#nav a:hover span, body#home li.navhome a span, body#team li.navteam a span, body#produkte li.navprodukte a span, body#service li.navservice a span, body#kontakt li.navkontakt a span {background: #E3004F; color: #FFFFFF;}
div#rahmenoben {position: absolute; top: 0px; left: 0px; right: 0px; width: auto; height: 100px; overflow: hidden; background: #DEDEDE url(images/cssboxmania_logo.gif) no-repeat 10px 10px; text-align: right; padding-right: 20px;}
div#rahmenlinks {position: absolute; top: 100px; left: 0px; width: 200px; height: 100%; overflow: hidden; background: #EDEDED;}
div#menu {margin: 3.0em 20px;}
div#menu ul {list-style-type: none;}
div#menu ul li {font-weight: bold;}
div#menu ul ul li {font-weight: normal; margin-left: 10px;}
div#menu li.tomaten {background: #E3004F; margin-left: -30px; margin-right: -20px; padding-left: 40px;}
div#menu li.tomaten a {color: #FFFFFF; font-weight: bold;}
div#hauptrahmen {position: absolute; left: 200px; top: 120px; right: 0px; bottom: 0px; overflow: auto; background: #FFFFFF;}
div#maintext {margin: 2.0em;}
/* Star-html-Hack 4IE6 */
* html body {padding: 120px 0px 0px 200px;}
* html div#hauptrahmen {height: 100%; width: 100%;}
* html div#rahmenoben {width: 100%;}