Hallo,
ich beschäftige mich noch nicht sehr lange mit html usw. bin aber gerade dabei, meine zweite Seite zu Programmieren.
Sie soll einen header haben, der immer am oberen Rand des Browserfensters "klebt" und einen footer, der immer am unteren Rand klebt. Der Bereich dazwischen (mit Ausnahme der Unternavigation auf der linken Seite), soll scrollbar werden, sobald der Inhalt den verfügbaren Platz überschreitet.
Das funktioniert im Firefox auch sehr gut, nur der IE scheint nur bottom ODER top zu erkennen. Kann mir jemand helfen, wie die Seite auch im IE funktioniert?
Vielen Dank schonmal!
Liebe Grüße,
Annikan87
ich beschäftige mich noch nicht sehr lange mit html usw. bin aber gerade dabei, meine zweite Seite zu Programmieren.
Sie soll einen header haben, der immer am oberen Rand des Browserfensters "klebt" und einen footer, der immer am unteren Rand klebt. Der Bereich dazwischen (mit Ausnahme der Unternavigation auf der linken Seite), soll scrollbar werden, sobald der Inhalt den verfügbaren Platz überschreitet.
Das funktioniert im Firefox auch sehr gut, nur der IE scheint nur bottom ODER top zu erkennen. Kann mir jemand helfen, wie die Seite auch im IE funktioniert?
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title></title>
<style type="text/css">
body {
font-family: arial, verdana, sans-serif;
font-size:12px
}
a, a:visited {
text-decoration:none;
color:#ffffff;
}
a:hover {
color:grey;
text-decoration:none;
}
</style>
</head>
<body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#ffffff" vlink="#ffffff">
<div style="width:700px; margin:0px auto; background-image: url(img/header/headerueberuns.jpg); background-repeat: no-repeat;" >
<div style="width:700px;height:102px"><a href="index.html"><img src="img/header/blank.gif" border="0" ></a></div>
<div><a href="index.html" style="margin-left:27px;" >Home</a><a href="ueberunsteam.html" style="margin-left:25px;">Über uns</a> <a href="Produktezuhause.html" style="margin-left:25px;">Produkte</a> <a href="Service.html" style="margin-left:31px;">Service</a> <a href="Referenzen.html" style="margin-left:28px;">Referenzen</a><a href="Partner.html" style="margin-left:28px;">Partner</a><a href="Kontakt.html" style="margin-left:28px;">Kontakt</a><a href="Impressum.html" style="margin-left:27px;">Impressum</a>
</div>
<br /><br />
<div style="width:540px; position:absolute; left:450px; top:160px; bottom:8em; overflow-y:auto; float:right;" id="container" >
<img src="img/Bilder/philo.jpg"><br>
Zu aller Erst einmal möchten wir Ihnen aufmerksam zuhören um möglichst genau zu erkennen wo „der Schuh drückt“. Gemeinsam finden wir dann eine Lösung die perfekt zu Ihnen und Ihren Anforderungen passt. Egal ob es ein kleiner, leiser Drucker für den Schreibtisch sein soll oder die farbfähige Multifunktionslösung für die Produktion von Kleinauflagen.
Wir sind Ihr Partner rund ums Dokument.
Unsere Lösungen und Produkte wählen wir nach folgenden Kriterien für
Sie aus:<br><br>
* intuitive u. einfache Bedienung<br>
* Umweltverträglichkeit durch niedrigen Energiebedarf<br>
* hohe Wirtschaftlichkeit durch Langlebigkeit<br>
* hohe Verfügbarkeit im täglichen Einsatz<br><br>
Sie konzentrieren sich voll und ganz auf Ihr Geschäft. <b>easy</b> sorgt dafür das alles rundum sorglos läuft.<br><br>
Alles, damit Sie besser bleiben!
</div>
<div style="width:140px; height:170px ; margin-left:1.6em ;background-image: url(img/ueberuns/ueberunsphilosophie.jpg); background-repeat: no-repeat;">
<div style="padding-left:5px;padding-top:5px;" >
<a href="ueberunsteam.html">Team</a><br /><br />
<a href="ueberunsphilosophie.html">Philosophie</a><br /><br />
<a href="ueberunsvorteile.html">Vorteile</a><br /><br />
<a href="ueberunsanfahrt.html">So finden Sie uns</a>
</div>
</div>
</div>
<div style="width:700px; position:absolute; bottom: 0px; left: 50%; margin-left: -350px;"><img src="img/footer/footer.jpg" /></div>
</body>
</html>
Liebe Grüße,
Annikan87