nicht angemeldet
Hallo!
Bitte entschuldigt meine vermutlich sehr laienhafte Frage - aber ich bin Anfänger und komme jetzt nicht mehr weiter. Mit Hilfe von SELFHTML habe ich eine Site gebaut mit festem Header (fürs Logo) und festem Footer (für die Navigation). Der content soll ggf. gescrollt werden. Dabei habe ich den IE-Workaround unter http://aktuell.de.selfhtml.org/artikel/css/footer/#footer_feststehend_alle benutzt, damit auch der Explorer das anzeigt. Unter Firefox und Safari funktioniert es auch wunderbar - nur nicht im IE - da fliegt das ganze Design auseinander.
Vielleicht könnt Ihr ja mal einen Blick auf CSS und HTML werfen und sieht auf Anhieb, woran es liegt. Vielen Dank schon mal für die Hilfe!
Hier das CSS - unten der IE-Teil:
body { background-color:white;
color:gray;
max-width:500px;
text-align:left;
margin:0;
padding:0; }
#content_container { margin-top:100px; margin-left:100px; margin-bottom:120px;
font-family:"Courier New",Courier,sans-serif;
line-height:135%;
text-align:left;
font-size:9pt; }
a[href^="http://"]:before { content: "\2197\a0" }
a:link { text-decoration:none;
color:gray }
a:visited { text-decoration:none;
color:gray }
a:hover { text-decoration:none;
color:black }
a:active { text-decoration:none;
color:black }
li { display:inline;
list-style:none; }
h1 { text-transform: uppercase;
font-weight: bold; font-size: 125%}
#header { position:fixed;
top:0px; left:0px; right:0px;
background:white;
font-family:Verdana,sans-serif;
text-transform:uppercase;
font-size:14pt;
color:#FF6600;
text-align:left; margin-left:50px;
padding:20px;
padding-bottom:60px; }
#footer { position:fixed;
bottom:0px; left:10px; right:0px;
background:white;
text-align:left;
padding:10px; padding-top:50px;
font-family:Verdana,sans-serif;
text-transform:uppercase;
font-size:12pt;
color:#FF6600; }
/* Angaben nur für den Internet Explorer mit Star-HTML-Hack */
* html, * html body
{
height:100%;
overflow:hidden;
}
* html #header
{
margin:0;
height:10%;
}
* html #content_container
{
padding:0.5em;
height:85%;
overflow:auto;
}
* html #footer
{
height:5%;
padding-top:1%;
}
---------------------------------------------------------------------
eine HTML-Seite:
<!DOCTYPE html public "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<?php
$current_page = "profil";
include('menue.php');
?>
<?php include("head.php"); ?>
<body>
<div id="header">
<?php include("logo.php"); ?>
</div>
<div id="content_container">
<h1>Lorem ipsum</h1> <p>dolor sit amet, consectetuer adipiscing elit. Nullam tincidunt tellus vel ante. Phasellus nec arcu a diam molestie pretium. Nulla facilisi. Donec laoreet mattis nibh. Vestibulum sit amet felis. Etiam scelerisque vehicula tortor. Etiam luctus, tellus et lacinia laoreet, dolor mauris volutpat lacus, et venenatis nunc mauris porttitor nunc. Etiam condimentum. Ut vel ante vel nisi tincidunt egestas. Etiam non tortor. Fusce eros est, imperdiet non, consectetuer ac, dictum id, nibh. Sed volutpat est vitae nibh. Sed libero ante, ultrices id, auctor feugiat, facilisis eget, ante. Nulla nec sapien id est pulvinar elementum. Nullam dignissim.
Curabitur vel diam ac nisl ullamcorper nonummy. Quisque porttitor consectetuer purus. Mauris pharetra varius arcu. In gravida leo eget nisi. Aliquam dictum viverra sem. Aenean arcu. Integer non tortor. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In hac habitasse platea dictumst. Aliquam condimentum, diam quis vestibulum scelerisque, ligula nulla tristique nisl, eget eleifend nunc justo id tortor. Sed eget metus egestas felis elementum vehicula. Ut elementum pharetra orci.
</p>
<h1>Lorem ipsum</h1> <p>Curabitur vel diam ac nisl ullamcorper nonummy. Quisque porttitor consectetuer purus. Mauris pharetra varius arcu. In gravida leo eget nisi. Aliquam dictum viverra sem. Aenean arcu. Integer non tortor. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In hac habitasse platea dictumst. Aliquam condimentum, diam quis vestibulum scelerisque, ligula nulla tristique nisl, eget eleifend nunc justo id tortor. Sed eget metus egestas felis elementum vehicula. Ut elementum pharetra orci.</p>
</div>
<div id="footer">
<?php echo $navi ?>
</div>
</body>
</html>